Question

我正在使用jquery animate函数滚动列表项html代码位于

之下

<ul>
    <div class="scrollable" id="web_list">
        <div class="updown">
            <a class="up" onclick="scrollUp('web_list')">UP</a>
        </div>
        <div class="items">
            <li>item 1<li>
            <li>item 2</li>
            <li>item 3</li>
            <li>item 4</li>
            <li>item 5</li>
        <div class="updown">
            <a class="down" onclick="scrollDown('web_list')">DOWN</a>
        </div>
</ul>

和在JS

function scrollDown(scrollDiv){
    $('#'+''+scrollDiv+' .items li').animate({top:'-=43'});
}

function scrollUp(scrollDiv){
    $('#'+''+scrollDiv+' .items li').animate({top:'+=43'});
}

在CSS中

.scrollable .items li {
  position:relative;
  overflow: hidden;
 }

现在，我可以滚动列表，但问题是我无法停止滚动，它无限滚动，

我希望在最后一项显示在底部时停止滚动（向上/向下），以便用户可以理解这是最后一项。任何人都可以帮我这样做。还有一件事是实现列表滚动的好主意。

Answer 1

这个怎么样？

 if( $("div.items:first").offset().top + $("div.items:first").height() <= 
     $("div.items:first li.items:last").offset().top + 
     $("div.items:first li.items:last").height()     
    ){
            //stop scrolling
            $("a.down").hide()
    }

列表到达时如何取消动画

1 个答案: