자바 스크립트 슬라이드 쇼 "다음"이미지 혼동을 선택하십시오

Question

저는 javascript를 매우 새로 도입했습니다. 다음 코드는 잘 작동합니다. "다음"버튼을 클릭하면 슬라이드 쇼가 어떻게 멈춰야합니까?하지만 이전 이미지를 표시하려면 클릭하면 하나의 그림 만 표시되고 멈 춥니 다. 나는 틀린 것을 얻을 수 없다. 도와주세요

window.onload = function() { 

    newImg = new Array("images/image1.jpg", "images/image2.jpg", "images/image3.jpg", "images/image4.jpg"); 

    var iImage = 1; 

    var imgTimer = new Timer(); 
    imgTimer.Interval = 5000; 
    imgTimer.Tick = function() { 
     document.slideshow.src = newImg[iImage]; 
     iImage++ 
     if (iImage >= newImg.length) { 
      iImage = 0; 
     } 

     document.getElementById('next').onclick = function() { 
      if (iImage < newImg.length) { 
       document.slideshow.src = newImg[iImage]; 
       iImage++ 
       if (iImage = newImg.length) { 
        iImage = 0; 

       } 
      } 
      imgTimer.Stop(); 
     } 
     document.getElementById('prev').onclick = function() { 
      if (iImage > 0) { 
       document.slideshow.src = newImg[iImage]; 
       iImage-- 
       if (iImage = 0) { 
        iImage = newImg.length; 
       } 
      } 
      imgTimer.Stop(); 
     } 


    }; 
    imgTimer.Start(); 
}; 

Answer 1

이 자바 스크립트는 이미지를 순환하지만 사용자가 다음 또는 이전 버튼을 클릭하면 자동 순환이 중단됩니다.

window.onload = function() { 
    var newImg = ["images/image1.jpg", 
        "images/image2.jpg", 
        "images/image3.jpg", 
        "images/image4.jpg"], 
     iImage = 0, 
     slide = document.getElementById('slideshow'), 
     next = document.getElementById('next'), 
     prev = document.getElementById('prev'), 
     interval = 3200, 
     t = null; 

    next.onclick = function() { 
     iImage++; 
     if (iImage >= newImg.length) { 
      iImage = 0; 
     } 
     slide.src = newImg[iImage]; 
     if (t !== null) { 
      clearInterval(t); 
      t = null; 
     } 
    }; 

    prev.onclick = function() { 
     iImage--; 
     if (iImage < 0) { 
      iImage = newImg.length - 1; 
     } 
     slide.src = newImg[iImage]; 
     if (t !== null) { 
      clearInterval(t); 
      t = null; 
     } 
    }; 

    t = setInterval(function() { 
     iImage++; 
     if (iImage >= newImg.length) { 
      iImage = 0; 
     } 
     slide.src = newImg[iImage]; 
    }, interval); 

    slide.src = newImg[iImage]; 
}; 

이이 같은 HTML을 가정

<input id='prev' value='prev' type='button'/> &nbsp; 
<input id='next' value='next' type='button'/> <br/> 
<img id='slideshow' src='' style='width:300px;'/>