瀏覽器卡死了，什么導致的，目的是讓圖片隨機滾動，請幫助？？？大神
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題檔案</title>
<style>
#box { width: 300px; height: 400px; margin: 0 auto; border: 1px solid #000; background: #FBE9EF; }
ul { padding: 0; margin: 0; float: left; }
li { list-style: none; width: 125px; height: 90px; margin: 0px 10px 5px 10px; border: 1px solid #000; position: relative; overflow: hidden; }
img { width: 125px; height: 90px; vertical-align: top; position: absolute;}
.img1 { top: 0; left: 0; }
.img2 { top: 90px; left: 0; }
</style>
<script>
window.onload=function(){
var aImg=document.getElementsByTagName('img');
var aImg1=document.getElementsByClassName('img1');
var aImg2=document.getElementsByClassName('img2');
var aLi=document.getElementsByTagName('li');
var arr=[];
var arrImg=['Img/1.gif','Img/2.gif','Img/3.gif','Img/4.gif','Img/5.gif','Img/6.gif','Img/7.gif','Img/8.gif','Img/9.gif','Img/10.gif','Img/11.gif','Img/12.gif','Img/13.gif','Img/14.gif','Img/15.gif','Img/16.gif'];
var timer=null;
for(var i=0;i<aImg.length;i++){
aImg[i].src=https://bbs.csdn.net/topics/arrImg[i];
aImg[i].index=true;
};
timer=setInterval(function(){
Random();//隨機產生1-8個隨機不重復數字
for(var i=0;i<arr.length;i++){
var j=arr[i];
if(aImg1[j].index){
doMove(aImg1[j],'top',10,-90,function(){
aImg1[j].index=false;
});
doMove(aImg2[j],'top',10,0);
}else{
doMove(aImg1[j],'top',10,0,function(){
aImg1[j].index=true;
});
doMove(aImg2[j],'top',10,90);
}
}
},2000);
function Random(){//隨機產生1-8個隨機不重復數字
var Num=Math.ceil(Math.random()*aLi.length);
while(arr.length<=Num){
var isRandom=Math.round(Math.random()*(aLi.length-1));
if (arr.length==0){
arr.push(isRandom);
}else{
if(arr.join(',').indexOf(isRandom)==-1){
arr.push(isRandom);
}
}
}
};
function doMove(obj,attr,dir,target,endFn){
dir = parseInt(getStyle(obj,attr))<target ? dir : -dir; //dir=回傳值
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var speed=parseInt(getStyle(obj,attr))+dir;
if(speed<target && dir<0 || speed>target && dir>0){
speed=target;
}
obj.style[attr]=speed+'px';
if(speed==target){
clearInterval(obj.timer);
//if(endFn){endFn();};
endFn && endFn();//有就執行
}
},40)
};
function getStyle(obj,attr){
return obj.currentStyle?obj.currentStyle[attr] : getComputedStyle( obj )[attr];
};
}
</script>
</head>
<body>
<div id="box">
<ul>
<li><img class="img1" src="" alt=""><img class="img2" src="" alt=""></li>
<li><img class="img1" src="" alt=""><img class="img2" src="" alt=""></li>
<li><img class="img1" src="" alt=""><img class="img2" src="" alt=""></li>
<li><img class="img1" src="" alt=""><img class="img2" src="" alt=""></li>
</ul>
<ul>
<li><img class="img1" src="" alt=""><img class="img2" src="" alt=""></li>
<li><img class="img1" src="" alt=""><img class="img2" src="" alt=""></li>
<li><img class="img1" src="" alt=""><img class="img2" src="" alt=""></li>
<li><img class="img1" src="" alt=""><img class="img2" src="" alt=""></li>
</ul>
</div>
</body>
</html>
uj5u.com熱心網友回復：
你把while改成if在除錯除錯，while用不好容易死回圈造成瀏覽器卡死uj5u.com熱心網友回復：
好的我試試，謝謝啊
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/59684.html
標籤：JavaScript