javascript - 聆听水平滚动

Question

Javascript 能够监听动态滚动(scrollTop()；不是吗)。但是，如果我水平滚动，是否有一个函数可以监听我滚动的位置？

我有一个图像 div，可以水平滚动(参见:http://jsfiddle.net/j5q1b8x9/)。

.scroll-container {
overflow-x: scroll;
overflow-y: hidden;
white-space: nowrap;

}

我想要做的是，当我向右滚动时，红色框将向左移动，反之亦然。我尝试过scrollLeft(); ，但是当我到达图像末尾时它会自行触发，因此它不会即时监听坐标。

额外的，可以通过使用 foreach 路径对每个图像实现这种功能吗？ IE。如果我从视口(viewport)中从左向右滚动一张图像，红色框将从右向左移动，当新图像弹出到视口(viewport)时，新图像的爵士乐再次开始。

有什么想法我应该测试什么才能使红色框在从左向右滚动时像镜子一样移动吗？

Answer 1

如果我理解你的问题，这有效 DEMO

var container = $(".scroll-container");
var box= $(".test-div");
var scrollX =container.scrollLeft();
container.scroll(function(){
var delta =container.scrollLeft() - scrollX; // direction < 0 From left to right
scrollX =container.scrollLeft();
if (delta<0)

    box.css({left:0, right:'auto'});  
else
    box.css({left:'auto', right:0});

});