Prev Next with jquery

Question

이전과 다음 버튼이있는 요소를 살펴볼 필요가 있지만 어떻게해야하는지 문제가 있습니다. 도울 수 있니. 이전/다음 또한 연속적으로 반복되어야합니다. 마지막 항목으로 가면 첫 번째 항목으로 이동하고 prev를 통해 첫 번째 항목으로 갈 때 다음 항목을 클릭하면 마지막 항목으로 이동하게됩니다.

<ul> 
<li>Number 1 item</li> 
<li>Number 2 item</li> 
<li>Number 3 item</li> 
<li>Number 4 item</li> 
</ul> 

많은 감사, C

Answer 1

당신이 시작이 가야 : fiddle

HTML :

<ul> 
    <li>Number 1 item</li> 
    <li>Number 2 item</li> 
    <li>Number 3 item</li> 
    <li>Number 4 item</li> 
</ul> 
<input type="button" class="next" value=">" /> 
<input type="button" class="prev" value="<" /> 

자바 스크립트 :

(function(){ 
    var $lis = $('ul li'); 
    var index = 0, lastIndex = 0; 

    start(); // activate first, add event listeners to buttons 

    function next(){ 
     lastIndex = index; 
     if(++index == $lis.length) index = 0; // if next is out of bounds go to first 
     $lis.eq(index).addClass('active'); 
     $lis.eq(lastIndex).removeClass('active'); 
    }; 

    function prev(){ 
     lastIndex = index; 
     if(--index < 0) index = ($lis.length - 1); // if prev is less than first to to last 
     $lis.eq(index).addClass('active'); 
     $lis.eq(lastIndex).removeClass('active'); 
    }; 
    function start(){ 
     $lis.eq(0).addClass('active'); 
     $('.next').click(next); 
     $('.prev').click(prev); 
    } 
})(); 

Answer 2

다음은 사용할 수있는 또 다른 예입니다. - posted on jsFiddle