jquery - 如何更改滚动方向

Question

我喜欢为特定列更改相反方向的滚动方向。我尝试搜索谷歌，但我没有找到任何解决方案。举个例子，拿这个...

jFiddle：http: //jsfiddle.net/yLHeC/1/

共有三列，

左，中，右。每列高度为 5000px。中心列的负边距为 4500 像素。现在当用户滚动时，左右应该像往常一样，但中心应该从下到上滚动。希望你明白了。

示例网站：http ://www.ballantyne.it/

.left{
height:5000px;
}

.center{
height:5000px;
margin-top:-4500px;
}

.right{
height:5000px;
}

Answer 1

您必须为中心列添加一个容器，将其溢出设置为隐藏，将高度设置为窗口的高度，然后使用$(window).scroll()事件附加$(document).height() - $(window).scrollTop()到中心列 - 这应该适合您

编辑：这里是代码http://jsfiddle.net/yLHeC/30/和解释：

$(document).ready(function(){
    var CONSTANT_OFFSET = -200; // starting position
    $(window).scroll(function(){
       $('.center').css('margin-top', CONSTANT_OFFSET + $(this).scrollTop()*2 + 'px'); 
    }).scroll();
});

Answer 2

在我的示例中，滚动位置被锁定到相邻列的高度，因此移动量是比率的计算，因此是精确的。

http://jsfiddle.net/kuxi/xNSTb/

$('.right').scrollTop(
    ($('.right .content').height() - $(window).height())
    *
    ( 1 - $(window).scrollTop() / ($('.left .content').height() - $(window).height()))
);