91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

js實現圖片數組中圖片切換效果

js
小云
118
2023-08-09 13:54:27
欄目: 編程語言

可以通過以下的代碼實現圖片數組中圖片的切換效果:

// HTML結構
/*
<div id="slider">
<img id="image" src="image1.jpg">
</div>
<button onclick="previousImage()">上一張</button>
<button onclick="nextImage()">下一張</button>
*/
// JavaScript代碼
var images = ["image1.jpg", "image2.jpg", "image3.jpg"]; // 圖片數組
var currentIndex = 0; // 當前顯示的圖片索引
function previousImage() {
currentIndex--;
if (currentIndex < 0) {
currentIndex = images.length - 1;
}
document.getElementById("image").src = images[currentIndex];
}
function nextImage() {
currentIndex++;
if (currentIndex >= images.length) {
currentIndex = 0;
}
document.getElementById("image").src = images[currentIndex];
}

上述代碼中,通過一個圖片數組來存儲所有圖片的路徑,然后使用一個currentIndex變量來記錄當前顯示的圖片索引。當點擊上一張按鈕時,currentIndex減1,如果currentIndex小于0,則將其設置為數組的最后一個元素的索引,然后將當前顯示的圖片的src屬性設置為images[currentIndex]。當點擊下一張按鈕時,currentIndex加1,如果currentIndex大于等于數組的長度,則將其設置為0,然后將當前顯示的圖片的src屬性設置為images[currentIndex]

這樣就實現了圖片數組中圖片的切換效果。

0
鄂伦春自治旗| 秦安县| 鄂托克前旗| 富蕴县| 邯郸市| 广昌县| 巴林右旗| 涞水县| 瓮安县| 舒城县| 佳木斯市| 吴旗县| 东阿县| 肃北| 平潭县| 贞丰县| 米易县| 久治县| 五原县| 郯城县| 广水市| 雅安市| 舞阳县| 平江县| 宁海县| 中阳县| 措美县| 谢通门县| 丘北县| 吉首市| 浦北县| 兴国县| 鄂伦春自治旗| 仪征市| 汉寿县| 呼伦贝尔市| 昌吉市| 瑞安市| 江川县| 闸北区| 安陆市|