CODEWITHSUNDEEP
jqueryscrolljquery-animatescrolltop
Roy Tatum
Roy Tatum

Reputation: 3

Delay in jQuery animation

I'm trying to animate the opacity of a div using jQuery. It works fine when I don't use this if/else statement, but when I do, there is a delay before the animation takes place. I tried setting delay to '0' but that didn't help. Here is the code:

$(window).scroll(function(){ 

    if ($(this).scrollTop() > 60){ 
        $('#navStick').fadeTo("slow", 1);
    } else {
        if ($(this).scrollTop() <= 60){
            $('#navStick').fadeTo("slow", 0);
        }
    }

});

Upvotes: 0

Views: 2319

Answers (1)

Lil&#39; Bits
Lil&#39; Bits

Reputation: 898

As Joseph Silber said, the second if statement is redundant. Control will only reach that point if it's less than or equal to 60.

Try using .stop(true) before your animations

$(window).scroll(function(){ 

    if ($(this).scrollTop() > 60){ 
        $('#navStick').stop(true).fadeTo("slow", 1);
    } else {
        $('#navStick').stop(true).fadeTo("slow", 0);
    }

});

Upvotes: 4

Related Questions