如何取消動畫時列表到達終點

Question

我使用jQuery的動畫功能的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() 
    }