jQuery scrollTop保持触发功能

我正在使用jQuery使标题div在滚动过去时保持粘性（位置：fixed）

下面是我使用的代码，非常有效：

    $(window).scroll(function() {
    var y = $(this).scrollTop();

    if (y >= 200) {
        $('.top').addClass('sticky');
    } else {
        $('.top').removeClass('sticky');
    }
});

然而，我发现用户体验有点欠缺。我开始玩弄jQuery UI——我在网站的其他地方使用它，所以它已经包含在内了——下面是我遇到问题的地方：

$(window).scroll(function() {
    var y = $(this).scrollTop();

    if (y >= 200) {
        $('.top').toggle('fade', 200, function() {
            $('.top').addClass('sticky', function() {
                $('.top').toggle('fade', 200);
            });
        });
    } else {
        $('.top').removeClass('sticky');
    }
});

我想要的行为是div淡出，变粘，然后淡入

它触发正常，但它只是不断地来回闪烁。反复切换淡入淡出

有人能告诉我如何达到我的预期行为吗？我只想让它在滚动过去后注册，而它似乎一直在听滚动位置

---

谢谢。

我想现在发生的是动画已经排队并一直切换状态，因为它在滚动时不断被触发。最终，动画将在滚动距离确定的持续时间内停止

因此，您需要中断动画

var y = $(this).scrollTop();

if (y >= 200) {        
    $('.top')
        .stop(true, true)
        .fadeOut(200).delay(200)
        .fadeIn(200).addClass('sticky');
} else {
    $('.top').removeClass('sticky');
}

jQuery

这里有一个