Jquery Carousel 이전 슬라이드

Question

다음 및 이전 슬라이드를 스크롤하는 자동 재생 및 화살표가있는 간단한 Jquery Carousel을 사용하려고했습니다. 다음 슬라이드 코드는 잘 작동하지만 이전 화살표는 작동하지 않습니다. 내 이미지를 거꾸로 뒤돌아 다니며 이전 이미지를 어떻게 되돌릴 지 모르겠다.

<div class="slider"> 
    <div id="slideshow"> 
     <div><h1 style="text-align: center; margin-top: 300px;">This is the FIRST slider</h1></div> 
     <div id="slide-1"> 
      <h1 style="text-align: center; margin-top: 300px;">This is the SECOND slider</h1> 
     </div> 
     <div id="slide-2"> 
      <h1 style="text-align: center; margin-top: 300px;">This is the THIRD slider</h1> 
     </div> 
     <div id="slide-3"> 
      <h1 style="text-align: center; margin-top: 300px;">This is the FOURTH slider</h1> 
     </div> 
     <div><h1 style="text-align: center; margin-top: 300px;">This is the LAST slider</h1></div> 
    </div> 
    <div class="arrow-div-1 show"><img src="images/arrow_left.svg" alt="" id="left-arrow"></div> 
    <div class="arrow-div-2 show"><img src="images/arrow_right.svg" alt="" id="right-arrow"></div> 
</div> 







$("#slideshow > div:gt(0)").hide(); 

var intrvl = setInterval(function() { 
    $('#slideshow > div:first') 
    .fadeOut(1000) 
    .next() 
    .fadeIn(1000) 
    .end() 
    .appendTo('#slideshow'); 
}, 3000); 



$(".arrow-div-2").click(function(){ 
    clearInterval(intrvl) 
    $('#slideshow > div:first') 
    .fadeOut(1000) 
    .next() 
    .fadeIn(1000) 
    .end() 
    .appendTo('#slideshow'); 
}) 

$(".arrow-div-1").click(function(){ 
    clearInterval(intrvl) 
    $('#slideshow > div:first') 
    .fadeOut(1000) 
    .prev() 
    .fadeIn(1000) 
    .end() 
    .appendTo('#slideshow'); 
}) 

Answer 1

어쨌든, 답을 얻었다. 두 번째 (왼쪽/이전) 화살표 div 코드는 다음과 같아야합니다.

$(".arrow-div-1").click(function(){ 
    clearInterval(intrvl) 
    $('#slideshow > div:first') 
    .fadeOut(1000); 
    $("#slideshow > div:last") 
    .fadeIn(1000) 
    .prependTo('#slideshow'); 
})