Richard Richard - 10 months ago 69
Javascript Question

jQuery Animation Jumpiness

I run into this problem often, having an animation jump or stutter at the end. Is there a common fix for this?

Here's the animation in action with the stutter at the end,

Click on the "slide down item" link in the menu to see the stutter.

Here's the jQuery code,

var menu_ul = $('.left-sidebar-nav > li > ul'),
menu_a = $('.left-sidebar-nav > li > a');

menu_ul.hide(); {

if(!$(this).hasClass('active')) {
} else {


Thank you


The css

.left-sidebar-nav li {
    margin-bottom: 8px;

is what is messing things up.

Remove it, and you will not see the effect.


To maintain the margin, just use margin-top: 10px

Here is the new fiddle

If you do not want the margin on the first element,

.left-sidebar-nav li:first-child {
    margin-top: 0;