利用JS進行圖片的切換即特效展示圖片
更新時間：2013年12月03日 17:24:32 作者：
做網(wǎng)頁時需要利用JS進行特效展示圖片，下面是利用JS簡單制作的圖片的切換，需要的朋友可以了解下
在網(wǎng)頁制作的時候，需要利用JS進行特效展示圖片，下面是利用JS簡單制作的圖片的切換。
<html>
<head>
<script type="JavaScript">
var srr = new Array('圖片一', '圖片二', '圖片三', '圖片四');//利用JS中內(nèi)置的數(shù)組，進行數(shù)據(jù)的存儲
var s = 0;
function chage() {
var img = document.getElementById('img1');
if (s <srr.length-1 ) {
s++;
}
else {
s = 0;
}
img.setAttribute('src', srr[s]);
}
function diaoyong() {
setInterval(chage, 1000);
}
</script>
</head>
<body onLoad="diaoyong();">
</body>
</html>
復(fù)制代碼 代碼如下:
<html>
<head>
<script type="JavaScript">
var srr = new Array('圖片一', '圖片二', '圖片三', '圖片四');//利用JS中內(nèi)置的數(shù)組，進行數(shù)據(jù)的存儲
var s = 0;
function chage() {
var img = document.getElementById('img1');
if (s <srr.length-1 ) {
s++;
}
else {
s = 0;
}
img.setAttribute('src', srr[s]);
}
function diaoyong() {
setInterval(chage, 1000);
}
</script>
</head>
<body onLoad="diaoyong();">
</body>
</html>
相關(guān)文章
PixiJS學(xué)習(xí)之如何實現(xiàn)文字的繪制
PixiJS是一個開源的基于web的渲染系統(tǒng)，為游戲、數(shù)據(jù)可視化和其他圖形密集型項目提供了極快的性能。這篇文章主要帶大家學(xué)習(xí)一下PixiJS是如何實現(xiàn)文字繪制的，希望對大家有所幫助2023-02-02
這篇文章主要介紹了javascript常用函數(shù)，再來15個常用函數(shù)，都具有很高的實用性，感興趣的小伙伴們可以參考一下2015-11-11
uni-app小程序?qū)崿F(xiàn)微信在線聊天功能(私聊/群聊)
這篇文章主要介紹了uni-app小程序?qū)崿F(xiàn)微信在線聊天（私聊/群聊）,今天記錄一下項目核心功能的實現(xiàn)過程。頁面UI以及功能邏輯全部來源于微信，即時聊天業(yè)務(wù)的實現(xiàn)使用socket.io，前端使用uni-app開發(fā)，后端服務(wù)器基于node實現(xiàn)，數(shù)據(jù)庫選擇mongoDB，需要的朋友可以參考下2023-02-02
這篇文章介紹了javascript中簡單的進制轉(zhuǎn)換代碼實例，有需要的朋友可以參考一下2013-10-10
淺析JS給原始數(shù)據(jù)類型加屬性和方法為什么不報錯
這篇文章主要想和大家一起探討一下JavaScript中給原始數(shù)據(jù)類型添加屬性和方法為什么不報錯,文中的示例代碼講解詳細,感興趣的小伙伴可以了解下2023-11-11
Three.js中實現(xiàn)一個OBBHelper實例詳解
這篇文章主要介紹了Three.js中實現(xiàn)一個OBBHelper,本文參考Box3Helper源碼，并寫出一個OBBHelper，本文結(jié)合實例代碼給大家介紹的非常詳細，需要的朋友可以參考下2023-09-09
本篇文章主要介紹了Redux實現(xiàn)組合計數(shù)器的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
這篇文章主要介紹了js中各種時間日期格式之間轉(zhuǎn)換的相關(guān)資料,還有獲取今天的年月日和計算兩個日期之間的相差天數(shù)的方法,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2025-03-03
本節(jié)主要介紹了ie8下面處理 new Date()的問題,需要的朋友可以參考下2014-07-07
這篇文章主要介紹了javascript獲取指針的位置的方法,通過代碼介紹了如何調(diào)用上面擴展函數(shù) getMP() 捕獲當前鼠標指針在文檔中的位置，需要的朋友可以參考下2021-10-10