html+css+js簡單實現圖片輪播效果
阿新 • • 發佈：2018-12-23
<script>
index=0;
function show_img(){
imgs=document.getElementById("shidian_img").children; //獲取所以圖片 並且儲存到陣列imgs數組裡
for(i =0; i<imgs.length;i++){
imgs[i].style.display="none";
} //迴圈獲取到imgs裡面的元素，並且把它們隱藏設定為“”none“”
imgs[index].style.display ="block"; //當所有元素都隱藏了，在顯示當前index所指的圖片。
index ++;
if(index >= imgs.length){
index=0;
} //判斷index是否大於imgs的長度，等於imgs的長度後在重新賦予它初始值0；
}
timer=setInterval(show_img,1000); //建立週期定時器。
</script>
index=0;
function show_img(){
imgs=document.getElementById("shidian_img").children; //獲取所以圖片 並且儲存到陣列imgs數組裡
for(i =0; i<imgs.length;i++){
imgs[i].style.display="none";
} //迴圈獲取到imgs裡面的元素，並且把它們隱藏設定為“”none“”
imgs[index].style.display ="block"; //當所有元素都隱藏了，在顯示當前index所指的圖片。
index ++;
if(index >= imgs.length){
index=0;
} //判斷index是否大於imgs的長度，等於imgs的長度後在重新賦予它初始值0；
}
timer=setInterval(show_img,1000); //建立週期定時器。
</script>