The jQuery slideToggle() Jump

the basic problem is:
you implement a basic slideToggle() but it jumps before it get to the bottom. It's based on jQuery working out the height wrong as it goes through its animation.

A quick fix is to simply add a fixed width to the element. But that doesn't help with responsive sites!

After much trial and error i found that if i added an each function to work out the height of each of my elements then this would sort it. But it worked out the height wrong as well! Nightmare!

What i did find is that if i didn't have my elements set to display:none at the start then it would slide perfectly with the correct heights. So i created this tiny function which works out the heights and then hides the elements. Also useful for those without js as the elements will be visible.

 $('.your-element').each(function() {
 $height = $(this).height();
 $(this).css('height', $height);
 $(this).hide();
});

$('.your-handler').click(function () {
$(this).next().slideToggle('slow');
$(this).toggleClass('active');
});