JavaScriptスライドのエラー

Question

私はボタンclick.Hereで変化するスライダーをしようとしています私のJSコードです。

var img1=document.getElementById("p1"); 
    var img2=document.getElementById("p2"); 
    var img3=document.getElementById("p3"); 

    function slidee(){ 
    var sl=0; 
     if(sl==0){ 
      img1.style.display= "none"; 
      img2.style.display= "block"; 
      sl=1; 
     } 
     if(sl==1){ 
      img2.style.display= "none"; 
      img3.style.display= "block"; 
      sl=2; 
     } 
     if(sl==2){ 
      img3.style.display= "none"; 
      img1.style.display= "block"; 
      sl=0; 
     } 
    } 

var btnn=document.getElementById("btn"); 
btnn.onclick=slidee; 

と、これは3枚の画像

#p1{ 
    display:block; 
} 
#p2{ 
    display:none; 
} 
#p3{ 
    display:none 

私は、P1ブロックなどnone.However作るとき、私は、P2やP3のブロックなどなしを作るとき何も、変化しないための私のCSSコードで、スライダがに行きますp1、それからもう一度変わらない。ここで何が問題なの？ そして、これはあなたが、関数の変数外を定義し、else ifを使用する必要がdivの

<div id="second"> 
<img class="mySlides" id="p1" src="rbt.jpg"> 
<img class="mySlides" id="p2" src="scv.jpg"> 
<img class="mySlides" id="p3" src="hml.jpg"> 
<button id="btn">Next</button> 
</div> 

Answer 1

のhtmlです。私は、P1ブロックなどnone.Howeverを作るとき、私は、P2やP3のブロックなどどれを作るとき

var sl=0; 
function slidee(){ 
    if(sl==0){ 
     img1.style.display= "none"; 
     img2.style.display= "block"; 
     sl=1; 
    } else if(sl==1){ 
     img2.style.display= "none"; 
     img3.style.display= "block"; 
     sl=2; 
    } else if(sl==2){ 
     img3.style.display= "none"; 
     img1.style.display= "block"; 
     sl=0; 
    } 
} 

Answer 2

何も、変化しない、スライダーは、P1になり、その後、再び変更doesntの。

変更する必要はありますか？ メソッドを呼び出すたびに、まず何が起こりますか？

function slidee(){ 
     var sl=0; 

     if(sl==0){ 
     img1.style.display= "none"; 
     img2.style.display= "block"; 
     sl=1; 
     } 
     ... 
    } 

ここでの問題は何ですか？

毎回slは、すべての関数呼び出しで0に設定されます。

var sl=0