[js效果] 图片加载进度实时显示

2006-08-02 17:45:45

[code] <script> var l=0; var imgs; var sum=0; var imgs=new Array(); function chk(){ l--; document.getElementById("aa").innerText=""+((sum-l)*100/sum)+"%" if (l==0){ for (var i=0;i<sum;i++) document.body.innerHTML+="<img src='"+imgs[i].src+"'>" } } if (document.images){ imgs[0]=new Image() imgs[1]=new Image() imgs[2]=new Image() imgs[3]=new Image() imgs[4]=new Image() imgs[5]=new Image() imgs[6]=new Image() imgs[7]=new Image() imgs[0].src="http://www.blueidea.com/articleimg/2006/08/3859/01.jpg"; imgs[1].src="http://www.blueidea.com/articleimg/2006/08/3859/02.jpg"; imgs[2].src="http://www.blueidea.com/articleimg/2006/08/3859/03.jpg"; imgs[3].src="http://www.blueidea.com/articleimg/2006/08/3859/04.jpg"; imgs[4].src="http://www.blueidea.com/articleimg/2006/08/3859/05.jpg"; imgs[5].src="http://www.blueidea.com/articleimg/2006/08/3859/06.jpg"; imgs[6].src="http://www.blueidea.com/articleimg/2006/08/3859/07.jpg"; imgs[7].src="http://www.blueidea.com/articleimg/2006/08/3859/08.jpg"; } </script> <body> <div id="aa">0%</div> <script> sum=l=imgs.length; for (var i=0;i<l;i++){ imgs[i].onload=chk; imgs[i].onerror=chk;//无论图片是否加载成功,都执行指定方法 } </script> </body> [/code]