Jquery taking too long to execute

Question

Jquery taking too long to execute

Navigation

#1 by (2 votes)

2

$(window).scroll(function () {

    if ($(this).scrollTop() > 0) {

        $('#header ul').animate({ width: 811, marginTop: 0 }, 200);
        $('#inicio-btn, #sobre-nos-btn, #sistemas-btn, #noticias-btn, #contato-btn, #usuario-btn').animate({ marginTop: 30 }, 200);
        $('#logo').animate({ width: 120, marginTop: 18 }, 200);

    } else {

        $('#header ul').animate({ width: 931, marginTop: 90 }, 200);
        $('#inicio-btn, #sobre-nos-btn, #sistemas-btn, #noticias-btn, #contato-btn, #usuario-btn').animate({ marginTop: 37 }, 200);
        $('#logo').animate({ width: 240, marginTop: 0 }, 200);

    }

});

When the condition is false, that is, when it returns to the top of the page, the code takes a while to run. It's as if JQ was there thinking about what to do ... I've tried a thousand things and nothing solves this problem.

jquery

asked by anonymous 05.02.2015 / 18:44

1 answer

List group only containing items Disable Jquery button in Chrome

score 2 · Answer 1

The problem can be caused by the lack of the call of stop before the animations.

Try to put your code like this:

$(window).scroll(function () {

    if ($(this).scrollTop() > 0) {

        $('#header ul').stop().animate({ width: 811, marginTop: 0 }, 200);
        $('#inicio-btn, #sobre-nos-btn, #sistemas-btn, #noticias-btn, #contato-btn, #usuario-btn').stop().animate({ marginTop: 30 }, 200);
        $('#logo').stop().animate({ width: 120, marginTop: 18 }, 200);

    } else {

        $('#header ul').stop().animate({ width: 931, marginTop: 90 }, 200);
        $('#inicio-btn, #sobre-nos-btn, #sistemas-btn, #noticias-btn, #contato-btn, #usuario-btn').stop().animate({ marginTop: 37 }, 200);
        $('#logo').stop().animate({ width: 240, marginTop: 0 }, 200);

    }

});