Search code examples
javascriptjqueryhtmlslidedown

jQuery slideDown is not smooth


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.


Solution

  • 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.