Question

I was wondering how could we do this… Got nothing on my mind…

So my question Title might be confusing so here’s full question.
How can we run our animation but skip animation of one class that contain .current…

This is menu animation so I don’t want to animate current class as there’s no point.

I was able to stop it by adding another class in CSS and using !important for height.
This way it looks like there’s no animation but if I inspect elements, of course there is…

JS Code:

$("#topMenu li").mouseover(function(){
    $(this).find('span').stop().animate({ height:'45px' }, { queue:false, duration:600, easing: 'easeOutBounce' });
});

$("#topMenu li").mouseout(function(){
    $(this).find('span').stop().animate({ height:'0px' }, { queue:false, duration:600, easing: 'easeOutBounce' });
});

var currentPage = $('#topMenu span').hasClass('current');

if(currentPage === true) {
    $('span.current').css('display', 'block');
}

So I am able to do this to look like there’s no animation… But can we do it somehow so there’s really no animation for the element that contain .current class in it ?

Answer 1

$(this).find('span:not(.current)').stop().animate...