Javascriptのスライドショーを選択 "次へ"画像の混乱

Question

私は非常にjavascriptに新しいです。次のコードは正常に動作します。 「次へ」ボタンをクリックすると、スライドショーはどのようにすべきかが止まりますが、前の画像をクリックして表示すると1枚の画像しか表示されなくなります。私は何が間違っているのか分からない。助けてください

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

このjavascriptはイメージを循環しますが、ユーザーが次のボタンまたはprevボタンをクリックすると、自動サイクリングが停止します。

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;'/>