js實(shí)現(xiàn)圖片輪換效果代碼
更新時(shí)間：2013年04月16日 15:16:32 作者：
本教程使用js實(shí)現(xiàn)兩張圖片切換/多張圖片輪換/結(jié)束執(zhí)行等效果，感興趣的朋友可以參考下哈，希望對(duì)你學(xué)習(xí)js有所幫助
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var numb = 0;
var imgnumb = 1;
function showimg() {
//兩張圖片切換方法1 /*numb++;
if (numb % 2 == 0) {
document.getElementById('img1').setAttribute('src', 'images/1.jpg');
}
else {
document.getElementById('img1').setAttribute('src', 'images/2.jpg');
}*/
//兩張圖片切換方法2 /*if (numb == 0) {
document.getElementById('img1').setAttribute('src', 'images/2.jpg');
numb = 1;
}
else {
document.getElementById('img1').setAttribute('src', 'images/1.jpg');
numb = 0;
}*/
}
/圖片輪換/多張 function imgfor() {
imgnumb++;
document.getElementById('img1').setAttribute('src', 'images/' + imgnumb + '.jpg');
if (imgnumb == 9) {
imgnumb = 0;
}
}
var clearid;
function clearfun() {
clearInterval(clearid);
}
clearid=setInterval(imgfor, 1000);
</script>
</head>
<body>
<img alt="" id="img1" class="style1" src="images/1.jpg" width="500px" height="500px" />
<input type="button" value="兩張圖片切換" onclick="showimg();" />
<br />
<input type="button" value="多張圖片輪換" onclick="imgfor();;" />
<br />
<input type="button" value="結(jié)束執(zhí)行" onclick="clearfun();" />
</body>
</html>
相關(guān)文章
這篇文章主要介紹了引入(調(diào)用)一個(gè)JS文的方法，非常不錯(cuò)介紹的非常詳細(xì)，具有參考借鑒價(jià)值，感興趣的朋友一起看看吧2016-05-05
做一個(gè)功能需要彈窗，因?yàn)間et方式對(duì)url的長度有限制,所以必須用post，本文有兩個(gè)不錯(cuò)的方法，大家可以參考下2014-01-01
JS中檢測數(shù)據(jù)類型的幾種方式及優(yōu)缺點(diǎn)小結(jié)
這篇文章主要介紹了JS中檢測數(shù)據(jù)類型的幾種方式及優(yōu)缺點(diǎn)小結(jié),非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-12-12
這篇文章主要介紹了JS截取字符串的方法,結(jié)合實(shí)例形式較為詳細(xì)的分析了JavaScript截取字符串的常用函數(shù)與具體使用技巧,并附帶說明了JS截取字符串substr和substring方法的區(qū)別,需要的朋友可以參考下2015-11-11
程序開發(fā)中，編程人員經(jīng)常要面對(duì)的是如何編寫代碼來響應(yīng)錯(cuò)誤事件的發(fā)生，即例外處理（exception handlers）。2008-06-06![javascript最短的拖動(dòng)代碼[兼容FF]](http://img.jbzj.com/images/xgimg/bcimg5.png)
javascript最短的拖動(dòng)代碼[兼容FF]...2007-10-10
下面小編就為大家?guī)硪黄獪\談JavaScript中變量和函數(shù)聲明的提升。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-08-08
JavaScript實(shí)現(xiàn)精美個(gè)性導(dǎo)航欄筋斗云效果
這篇文章主要介紹了JavaScript實(shí)現(xiàn)精美個(gè)性導(dǎo)航欄筋斗云效果，非常不錯(cuò)，具有參考借鑒價(jià)值,需要的朋友可以參考下2017-10-10
JavaScript中瀏覽器多標(biāo)簽頁通信的8種方案盤點(diǎn)
這篇文章主要為大家詳細(xì)介紹了JavaScript中瀏覽器多個(gè)標(biāo)簽頁通信的8種方案與實(shí)戰(zhàn)場景深度對(duì)比,文中的示例代碼簡潔易懂,有需要的可以參考下2025-03-03
javascript實(shí)現(xiàn)點(diǎn)擊按鈕切換圖片
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)點(diǎn)擊按鈕切換圖片，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-08-08