javascript - 滚动()变得很大滞后

Question

我正在尝试使用 jquery 为我的菜单制作动画 - 只需根据滚动更改填充。它工作正常，但执行时间非常长(1-10 秒)。有任何想法吗？我试过 .on('scroll') 但没有改变。

在 Chrome 和 Firefox 上。

有趣的事情——如果我添加 alert(v);在第 3 行之后确定滚动位置，它动画效果很好，没有任何滞后；x

    <script>
        $(window).scroll(function() {
            var v = $(window).scrollTop();
            if (v >= 150) {
                $('#header').animate({"padding": "15px 0px"},500);
            }
            else if (v < 150 ) {
                $('#header').animate({"padding": "50px 0x"},500);
            }
        });
    </script>

你可以在这里看到问题: http://monsiorski.com/_projects/robson/

Answer 1

<script>
    var isScrolled = false;
    $(window).scroll(function() {
        var v = $(window).scrollTop();
        if (v >= 150 && !isScrolled) {
            $('#header').animate({"padding": "15px 0px"},500);
            isScrolled = true;
        }
        else if (v < 150 && isScrolled) {
            $('#header').animate({"padding": "50px 0x"},500);
            isScrolled = false;
        }
    });
</script>