林雨其蒙吧 关注:4贴子:141
  • 1回复贴,共1

图片加载进度实时显示

只看楼主收藏回复

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>php爱好者_网页特效|www.phpfans.net|---图片加载进度实时显示</title>
<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[0].src="images/royale.jpg";
imgs[1].src="images/c0407.jpg";
imgs[2].src="images/royale.jpg";
imgs[3].src="images/c0407.jpg";
imgs[4].src="images/royale.jpg";
imgs[5].src="images/c0407.jpg";
}

</script>
</head>

<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>

</html>


IP属地:广西1楼2007-08-30 17:42回复
    http://www.dhwy88.cn/Article/wysj/dtwz/200706/271.html

    向右滚动:

    <div id=demo style=overflow:hidden;height:35;width:200;background:#214984;color:#ffffff>
    <table align=left cellpadding=0 cellspace=0 border=0><tr><td id=demo1 valign=top>
    <img src="/mmff/UploadFiles_9625/200512/20051218141423187.gif">
    <img src="/mmff/UploadFiles_9625/200512/20051218141424802.gif">
    <img src="http://iedoo.net/logo/mylogo.gif"></td>
    <td id=demo2 valign=top></td></tr></table></div>
    <script>
    var speed=30
    demo2.innerHTML=demo1.innerHTML
    demo.scrollLeft=demo.scrollWidth
    function Marquee(){
    if(demo.scrollLeft<=0)
    demo.scrollLeft+=demo2.offsetWidth
    else{
    demo.scrollLeft--
    }
    }
    var MyMar=setInterval(Marquee,speed)
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>

    向左滚动:

    <div id=demo style=overflow:hidden;height:35;width:200;background:#214984;color:#ffffff>
    <table align=left cellpadding=0 cellspace=0 border=0><tr><td id=demo1 valign=top>
    <img src="/mmff/UploadFiles_9625/200512/20051218141423187.gif">
    <img src="/mmff/UploadFiles_9625/200512/20051218141424802.gif">
    <img src="http://iedoo.net/logo/mylogo.gif"></td>
    <td id=demo2 valign=top></td></tr></table></div>
    <script>
    var speed=30
    demo2.innerHTML=demo1.innerHTML
    demo.scrollLeft=demo.scrollWidth
    function Marquee(){
    if(demo.scrollLeft<=0)
    demo.scrollLeft+=demo2.offsetWidth
    else{
    demo.scrollLeft++
    }
    }
    var MyMar=setInterval(Marquee,speed)
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>

    向上滚动:

    <div id=demo style=overflow:hidden;height:100;width:90;background:#214984;color:#ffffff>
    <div id=demo1>
    <img src="/mmff/UploadFiles_9625/200512/20051218141424802.gif">
    <img src="/mmff/UploadFiles_9625/200512/20051218141423187.gif">
    <img src="http://iedoo.net/logo/mylogo.gif">
    </div>
    <div id=demo2></div>
    </div>
    <script>
    var speed=30
    demo2.innerHTML=demo1.innerHTML 
    function Marquee(){
    if(demo2.offsetTop-demo.scrollTop<=0) 
    demo.scrollTop-=demo1.offsetHeight 
    else{
    demo.scrollTop++
    }
    }
    var MyMar=setInterval(Marquee,speed) 
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>

    向下滚动:

    <div id=demo style=overflow:hidden;height:100;width:90;background:#214984;color:#ffffff>
    <div id=demo1>
    <img src="/mmff/UploadFiles_9625/200512/20051218141424802.gif">
    <img src="/mmff/UploadFiles_9625/200512/20051218141423187.gif">
    <img src="http://iedoo.net/logo/mylogo.gif">
    </div>
    <div id=demo2></div>
    </div>
    <script>
    var speed=30
    demo2.innerHTML=demo1.innerHTML
    demo.scrollTop=demo.scrollHeight
    function Marquee(){
    if(demo1.offsetTop-demo.scrollTop>=0)
    demo.scrollTop+=demo2.offsetHeight
    else{
    demo.scrollTop--
    }
    }
    var MyMar=setInterval(Marquee,speed)
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>


    IP属地:广西2楼2007-10-10 16:25
    回复