互联网观察网站建设网站运营网络创业电子商务建站软件建站软件教程网站开发网页制作收藏本站

建站常识 | 域名 | 主机 | 网上开店 | 搜索引擎优化 | 网站推广 | 网络赚钱 | 站长经验 | 个人建站 | 网站设计 | 网页特效 | wap网站

首页 → 网页制作 → 网页特效 → 图形图象特效

网页特效图片加载进度实时显示

<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=http://www.webjx.com/htmldata/2006-08-02/'"+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>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

上一篇：最好的图片效果，是一个鼠标驱动图片的效果
下一篇：网页制作之在线视频播放代码

相关分类

网页特效 (766)

图形图象特效 (70)

时间日期特效 (50)

文本文字特效 (50)

浏览器特效 (81)

鼠标事件特效 (36)

状态栏特效 (35)

脚本技巧特效 (222)

CSS 代码特效 (47)

网页页面特效 (175)

版权所有 Copyright© 2006 黑马建站宝典联系方式：heima123#gmail.com