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回目のターンからはスライドが止まらず、後にスライドが停止することがあります。時にはトランザクションが表示されることもありますが、時には正しく動作することもありますが、次のスライドも盗聴されます。なぜそれが起こっているのか分かりません。できるなら、私を助けてください。
jsFiddleまたはcodepenを提供してください。私はあなたのコードを読んで私のために起こる可能性があるので、スライダーを再起動すると、あなたはvar idでsetIntervalをクリアしません。 – Fefux
jsFiddleとは何ですか?コデペン?私は各トランザクションの最後にclearInterval()を使用していますが、十分ではありませんか? –
[jsFiddle](https://jsfiddle.net/)(およびcodepenと同じ)は、コード出力を確認して問題を再生成する方法でコードをシミュレートできる環境なので、調査できます... – EhsanT