jQuery-通过鼠标滚轮平滑地将视差页面滚动到某些锚点

Question

我正在使用Stellar.js处理视差页面，我有一些相互叠加的视差窗格：

当用户向下滚动页面并到达该窗格时，我希望每个窗格都能顺畅滚动到顶部。 我的意思是我希望滚动条足够聪明，可以将每个窗格对齐到屏幕顶部。 我尝试了这个但是没有用：

h = $(window).height();
t = $('#parallaxtop').offset().top + $('#parallaxtop').height();
if(t > h) {
    $(window).scrollTop(t - h);
}

这是JSFiddle： http://jsfiddle.net/LDaUw/

Answer 1

我发现这有效：

var pageH = $(window).innerHeight(); //grab window height
    $(window).scroll(function() {
        clearTimeout($.data(this, 'scrollTimer'));
        $.data(this, 'scrollTimer', setTimeout(function() {
            var eTop = $('#parallaxtop').offset().top; //get the offset top of the element
            var myOffset = eTop - $(window).scrollTop(); //determine the offset from window
            if (myOffset > -100 && myOffset < pageH/2) { //if the offset is less than the half of page scroll to the panel
                    $('#parallaxtop').ScrollTo({ //ScrollTo JQuery plugin
                    });
            }
        }, 250)); //this will be calculated 250ms after finishing every scroll
    });

我已使用ScrollTo JQuery plugin进行平滑滚动。