2017-02-23 100 views
1

我用一些HTML CSS和Javascript來創建幻燈片。我在Youtube上發現了這個教程,它適用於我的使用。我在Stack Overflow上搜索了這個問題,顯然有人使用了完全相同的代碼。我的情況與該問題不同,所以這不是一個複製。但只有CSS執行不是Javascript。有沒有人看到這個問題?爲什麼我的幻燈片顯示Javascript不起作用?

這是我的HTML和CSS

<img id = "myPhoto" src="img1.JPG" alt= ""> 
<scipt src = "script.js"> </scipt> 

#myPhoto{ 
    margin: 20px 10%; 
    width: 80%; 
    height: 600px; 
} 

這裏是我的javascript

var myImage = document.getElementById("myPhoto"); 

var imageArray = ["img1.JPG", "img2.JPG"]; 

var imageIndex = 0; 

function changeImage() { 
    myPhoto.setAttribute("src" , imageArray [ imageIndex]); 
    imageIndex++; 
    if (imageIndex >= imageArray.length) { 
    imageIndex = 0; 
    } 
} 

var intervalHandle = setInterval(changeImage, 2000); 

myPhoto.onclick = function() { 
    clearInterval(intervalHandle); 
} 
+0

你在瀏覽器控制檯的任何錯誤? –

+0

「不工作」不是一個好的描述。您需要發佈一個複製問題的示例,請參閱[*如何創建最小,完整且可驗證的示例。*](http://stackoverflow.com/help/mcve) – RobG

+0

javascript效果未顯示 – Kat

回答

0

它正常工作,是什麼原因呢?

var myImage = document.getElementById("myPhoto"); 
 

 
var imageArray = ["http://placehold.it/150x150", "http://placehold.it/250x150"]; 
 

 
var imageIndex = 0; 
 

 
function changeImage() { 
 
    myPhoto.setAttribute("src" , imageArray [ imageIndex]); 
 
    imageIndex++; 
 
    if (imageIndex >= imageArray.length) { 
 
    imageIndex = 0; 
 
    } 
 
} 
 

 
var intervalHandle = setInterval(changeImage, 2000); 
 

 
myPhoto.onclick = function() { 
 
    clearInterval(intervalHandle); 
 
}
<img id = "myPhoto" src="http://placehold.it/250x150" alt= "">

+0

javascript效果沒有顯示。圖像不「滑動」。我在哪裏放置腳本?它應該在img標籤之前嗎? – Kat