목록은 끝

Question

내가 HTML 코드는 CSS

에서

<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'}); 
} 

에서 다음과 같습니다 JQuery와 애니메이션 기능을 사용하여 목록 항목의 스크롤을하고있는 중이 야에게 도달 할 때 애니메이션을 취소하는 방법

.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() 
    }