2016-11-28 4 views
0

スライドショー(Javascript)は最後のスライド以降正しく動作しますが、再起動すると割り当てられたフリーズ時間は停止しません。それは私のjsのコードです:スライドショーに奇妙な動作があります

var pos; 
var slides; 
var timeOut; 
var slideTime = 3000; 

window.onload = function(){ 
    pos = -1; 
    var slideContent = document.getElementById("slides"); 
    slides = slideContent.getElementsByTagName("article"); 
    initSlides(); 
}; 

function initSlides(){ 
    if (pos !== -1){ 
     pos++; 
     if (pos === slides.length){ 
      pos = 0; 
      exitSlide(slides[slides.length-1], slides[pos]); 
     }else{ 
      exitSlide(slides[pos-1], slides[pos]); 
     } 
    }else{ 
     pos ++; 
     slides[pos].style.display = "block"; 
     timeOut = setTimeout(initSlides, slideTime); 
    } 
} 

function changeSlide(next){ 
    if (next){ 
     pos++; 
     if (pos === slides.length){ 
      pos = 0; 
      exitSlide(slides[slides.length-1], slides[pos]); 
     }else{ 
      exitSlide(slides[pos-1], slides[pos]); 
     } 
    }else{ 
     pos --; 
     if (pos === -1){ 
      pos = slides.length - 1; 
     } 
    } 
} 

function enterSlide(obj){ 
    obj.style.display = "block"; 
    var left = obj.offsetLeft; 
    var current = obj.offsetWidth; 
    obj.style.marginLeft = current + "px"; 
    function frame(){ 
     current -= obj.offsetWidth/120; 
     if (current >= left){ 
      obj.style.marginLeft = current + "px"; 
     }else{ 
      clearInterval(id); 
      timeOut = setTimeout(initSlides, slideTime); 
     } 
    } 

    var id = setInterval(frame, 1); 
} 

function exitSlide(obj, objNext){ 
    clearTimeout(timeOut); 
    var left = obj.offsetLeft; 
    var current = -obj.offsetWidth; 
    function frame(){ 
     left += current/120; 
     if (left >= current){ 
      obj.style.marginLeft = left + "px"; 
     }else{ 
      clearInterval(id); 
      obj.style.display = "none"; 
      enterSlide(objNext); 
     } 
    } 

    var id = setInterval(frame, 1); 
} 

検査コードコンソールは私にエラーを与えるものではありませんが、スライドショーがとても盗聴です。 2回目のターンからはスライドが止まらず、後にスライドが停止することがあります。時にはトランザクションが表示されることもありますが、時には正しく動作することもありますが、次のスライドも盗聴されます。なぜそれが起こっているのか分かりません。できるなら、私を助けてください。

+0

jsFiddleまたはcodepenを提供してください。私はあなたのコードを読んで私のために起こる可能性があるので、スライダーを再起動すると、あなたはvar idでsetIntervalをクリアしません。 – Fefux

+0

jsFiddleとは何ですか?コデペン?私は各トランザクションの最後にclearInterval()を使用していますが、十分ではありませんか? –

+0

[jsFiddle](https://jsfiddle.net/)(およびcodepenと同じ)は、コード出力を確認して問題を再生成する方法でコードをシミュレートできる環境なので、調査できます... – EhsanT

答えて

0

Finalyは、私は自分のスライドショーを最新デザインし、私はこのプラグインを使用していますが、私の試みにdesisted:Slick - the last carousel