2013-02-24 87 views
1

此圖片滑塊不會顯示下一張圖片。我有3張圖片..圖像1,圖像2和圖像3,但它僅停留在此搜索..Javascript中的圖片滑塊

<script type="text/javascript"> 
var image1 = new Image(); 
image1.src="jokes.png"; 
var image2 = new Image(); 
image2.src="facts.png"; 
var image3 = new Image(); 
image3.src="csharp.png"; 
</script> 



<img src="jokes.png" name="slide" width="200" height="200"> 
<script type="text/javascript"> 
var step = 1; 

function slideit() { 
    document.images.slide.src = eval("image" + step + ".src"); 
    if (step < 3) { 
     step++; 
     else step = 1 
     setTimeout("slideit()", 2500); 
    } 
    slideit() 
} 
</script> 
+0

另外值得一提的是,如果'slideit() '自己調用,它只會重複一次,因爲你使用'setTimeout'而不是'setInterval'。 – Nightfirecat 2013-02-24 20:12:35

回答

4

因爲你的函數slideIt不會被調用。第一個電話被包含在函數內部...

試試這個

<script type="text/javascript"> 
var step = 1; 

function slideit() { 
    document.images.slide.src = eval("image" + step + ".src"); 

    if (step < 3) 
     step++; 
    else 
     step = 1 

    setTimeout("slideit()", 2500); 
} 

//First call 
slideit(); 
</script> 
+0

我試過了,它仍然沒有改變.. – 2013-02-24 20:15:10

+0

@SefBeezy查看我的回答 – tnanoba 2013-02-24 20:17:36

+0

哦,你的函數也有一個錯字。試試我更新的答案。 – sdespont 2013-02-24 20:20:11

0

除了sdespont的答案有語法問題

<script type="text/javascript"> 
var step = 1; 

function slideit() { 
    document.images.slide.src = eval("image" + step + ".src"); 
    if (step < 3){ 
     step++; 
    }else{ 
    step = 1; 
    } 
    setTimeout("slideit()", 2500); 

} 

//First call 
slideit(); 
</script>