DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 圖片輪換效果實現代碼(點擊按鈕停止執行)
圖片輪換效果實現代碼(點擊按鈕停止執行)
編輯:關於JavaScript     
在這個小程序中,需要把images文件夾下圖片的命名設置為有順序的,1、2、3……
復制代碼 代碼如下:
<script type="text/javascript">
var imgnumb = 1;
function imgfor() {
imgnumb++;
document.getElementById('img1').setAttribute('src', 'images/' + imgnumb + '.jpg');
if (imgnumb == 5) { //共5張圖片
imgnumb = 0;
}
}
var clearid;
function clearfun() {
clearInterval(clearid);
}
clearid=setInterval(imgfor, 500);
</script>
</head>
<body>
<img alt="" id="img1" class="style1" src="images/1.jpg" width="500px" height="500px" />
<input type="button" value="結束執行" onclick="clearfun();" />
</body>
var imgnumb = 1;
function imgfor() {
imgnumb++;
document.getElementById('img1').setAttribute('src', 'images/' + imgnumb + '.jpg');
if (imgnumb == 5) {
imgnumb = 0;
}
}
var clearid;
function clearfun() {
clearInterval(clearid);
}
clearid=setInterval(imgfor, 500);
</script>
</head>
<body>
<img alt="" id="img1" class="style1" src="images/1.jpg" width="500px" height="500px" />
<input type="button" value="結束執行" onclick="clearfun();" />
</body>
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved