jQuery slideDown is not smooth

user13746 picture user13746 · May 6, 2012 · Viewed 28.5k times · Source

I have this little jQuery slideDown effect http://jsfiddle.net/Gg4eP/2/

But the animation isn't smooth? What I am doing wrong?

Thanks for your time.

Answer

Gregg B picture Gregg B · May 6, 2012

You just need to add the width to each expandable div.

http://jsfiddle.net/BpMam/

To explain:

jQuery doesn't know the dimensions of your hidden div until it's displayed. So when it's clicked on it actually pulls it out of position to measure it before quickly replacing it. This often has the side effect of causing some jumpiness. Setting the width on the element prevents jQuery from pulling it out of position.