javascript - 如何在满足条件后重新运行事件函数？

Question

我试图让侧边栏以较慢的速度滚动，直到它到达某个点。当用户到达该设置点时，侧边栏应该停止滚动。这是我的 jQuery 代码:

$(window).on("scroll", function() {
    var sidebar = $('.sidebar');
    var stopPoint = $('#stop-point');
    var sidebarBottom = sidebar.offset().top + sidebar.height();
    var stopPointBottom = stopPoint.offset().top + stopPoint.height() - 30; 

    if (sidebarBottom > stopPointBottom) {
        $('.sidebar').css({'top' : "288px"});
    }
    else {
        $('.sidebar').css({'top' : ($(this).scrollTop()/3)+"px"});
    }
});

在 ELSE 条件成立时一切正常。问题是当满足 IF 条件时，即使我向上滚动并再次满足 ELSE 条件，侧边栏也会停留在其最低点。

如果有人能帮助我理解我做错了什么，以及是否有更聪明的方法来实现同样的目标，我将不胜感激。

提前致谢。

Answer 1

如果有人对这里感兴趣，我是如何修复它的:

$(window).on("scroll", function() {
    var sidebar = $('.sidebar');
    var stopPoint = $('#stop-point');
    var sidebarBottom = sidebar.offset().top + sidebar.height();
    var stopPointBottom = stopPoint.offset().top + stopPoint.height() - 30; 

    $('.sidebar').css({'top' : ($(this).scrollTop()/3)+"px"});

    if (($(this).scrollTop()/3) > 284 ) {
        $('.sidebar').css({'top' : "284px"});
    }
});

当滚动回到顶部时，sidebarBottom 比 stopPointBottom 大几个像素，因此无法满足条件。