Javascript 如何在滚动动画后将滚动事件附加到窗口

我试图在滚动动画完成后显示一个div，并在向上/向下滚动页面时将其隐藏。这是我的尝试：

$('#cta').on('click', function(e) {
    e.preventDefault();
    $('#layer, #servicesContent').addClass('active');

    var position = parseInt($('#services').offset().top);
    $('html, body').animate({
        scrollTop: position - 100
    }, 'slow', function() {
        $(window).bind('scroll', function() {
            $('#layer, #servicesContent').removeClass('active');
        });
    });
});

它不起作用。动画完成后，活动类将被删除，而不是滚动移动。
有什么想法吗？

---

提前感谢

我不太清楚原因，但很明显，至少在Chrome上，在Windows上，窗口大约需要20毫秒才能退出

滚动

状态。或者，jQuery的一个技巧是提前20毫秒启动动画功能，这样感觉更自然。（人类的眼睛和大脑产生的连接只需要很少的时间，也许他们已经考虑到了这一点）

无论如何，为了确保在

滚动

结束后进行绑定，请给它一个完整的

100ms

以完成并在之后进行绑定：

$（'cta'）。在（'click'，函数（e）上{
e、 预防默认值（）；
$（'#layer，#servicesContent'）.addClass（'active'）；
var位置=120；
$（'html，body'）。设置动画({
滚动顶部：位置-100
}，'slow'，function（）{
setTimeout（函数（）{
$（窗口）.bind（'scroll'，function（）{
$（“#层，#服务内容”）.removeClass（'active'）；
});
},100)
});
});您的代码在第一次运行，如果您尝试在第二次按下“CTA”按钮，滚动事件当然会自动触发。在第一次运行之后，任何窗口
scroll
事件都将运行绑定函数。如果你不想让它再次发生，你需要命名它并在你触发一次后将其删除。是的，我所要做的就是解除事件的绑定=）