How to get div height after action slider or slider?

Question

Code here: jsfiddle demo

I want to get the height of the div#content when it completes the slider down/up action.

For example, in the demo I type a few words, they make the height div 36px , so if I press slider down , I need to get the value 36 , and if I press slider up , I need to return the value 0 . Thank you

Answer 1

Then, but this is in the slideDown or slideUp callback function, for example, for example:

  $('#content').slideDown('slow', function(){ var height = $(this).height(); }); 

Demo

Note that it will give you the same height 38 in two cases slideDown and slideUp , because the two functions do not change the div height property, but only the display property from none to block , so the height #content height property is the same after it used to was down.

Answer 2

I know this is an old stream, but it appeared first when I searched for it, so I assume that others will land here.

Using a callback is what I do if I need a value after the animation finishes, but in my use case I need a height before the animation so that I can expand another element to the same height. To do this, I did the following:

 //Get height (start and end) var startHeight = $el.height(); $el.show(); var endHeight = $el.height(); $el.hide(); /**Do something useful with the height here**/ $el2.animate({height: endHeight}); //Slide the element down $el.slideDown(); 

Because JavaScript is single-threaded, show / hide is never displayed.