圖片加載進度實時顯示
<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="/articleimg/2006/08/3859/01.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;//無論圖片是否加載成功,都執(zhí)行指定方法
}
</script>
</body>
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
相關(guān)文章
JavaScript+html5 canvas繪制的圓弧蕩秋千效果完整實例
這篇文章主要介紹了JavaScript+html5 canvas繪制的圓弧蕩秋千效果,以完整實例形式分析了JavaScript集合html5的canvas繪制圖形的相關(guān)技巧,需要的朋友可以參考下2016-01-01
使用JS+XML(數(shù)據(jù)島)實現(xiàn)分頁)
使用JS+XML(數(shù)據(jù)島)實現(xiàn)分頁)...2007-01-01
理解JavaScript中的適配器模式Adapter?Pattern
這篇文章主要介紹了理解JavaScript中的適配器模式,適配器模式即Adapter?Pattern,是作為兩個不兼容的接口之間的橋梁。這種類型的設計模式屬于結(jié)構(gòu)型模式,下文更多相關(guān)介紹需要的小伙伴可以參考一下2022-04-04
javascript 不停(setInterval)/延時(setTimeout)函數(shù)使用實例
如果想實現(xiàn)頁面的一些函數(shù)的定時執(zhí)行,需要用到下面的函數(shù)大家可以看下用法。2009-08-08

