3

我希望能够检测到用户是否滚动了整个 div,overlfow:scroll; 而 div 是水平的,所以 usingoffset().top在这里不起作用。
我目前有这个代码:

var elem = $('#slide');
var inner = $('#slidecontain');
if ( Math.abs(inner.offset().top) + elem.height() + elem.offset().top >= inner.outerHeight() ) {
  alert('bottom')
}

这非常适合检查我何时滚动到底部,但由于它是水平滚动,它会立即触发。我该如何切换?有offset().left可能吗?

这是html,非常基本:

<div id="slide" style="width: 300px; height: 150px;">
        <div id="slidecontain" style="width: 900px; height: 150px;">
            <div class="slide1" style="width: 300px; height: 150px;"></div>
            <div class="slide2" style="width: 300px; height: 150px;"></div>
            <div class="slide3" style="width: 300px; height: 150px;"></div>
        </div>
<div>
4

2 回答 2

3

使用 jQuery 可以轻松完成.scrollLeft()

var elem = $('#slide');
var inner = $('#slidecontain');

elem.scroll(function() {
   if(elem.scrollLeft() + elem.width() == inner.width()) {
       alert("reached end!");
   }
});

这是一个模拟这个的小提琴。

于 2013-10-09T18:41:31.440 回答
0

在 jQuery 中有一个名为.scrollLeft()的方法可以在这里使用。但以相反的方式。

在寻找一些工作示例时,我发现了这个JSFiddle,由@Merianos Nikos 提供

这个怎么运作?

HTML:

<div class="inner">
    <div id="long"></div>
</div>

JS:

jQuery(document).ready(function ($) {
    var lastLeftLocation = 0;
    $('.inner').scroll(

    function (e) {
        if (lastLeftLocation > $(this).scrollLeft()) {

        } else {
            console.log("moved to right");
        }
        lastLeftLocation = e.currentTarget.scrollLeft;
    });
});

这是jsfiddle2的简化版本

仅供参考:没有反向方法.scrollRight();)

希望这可以帮助。

于 2013-10-09T18:23:10.827 回答