有没有进度条一类的东西

大部分都是假的,是一张图片,
要做进度跳也很简单,用一个<div>,每隔一段时间改变 div 的 style.width 就可以了

解决方案 »

  1.   

    <script type="text/javascript">
    <!--
    var ie5 = (document.all && document.getElementsByTagName);function setSB(v, el) {
    if (ie5 || document.readyState == "complete") {
    filterEl = el.children[0];
    valueEl  = el.children[1];

    if (filterEl.style.pixelWidth > 0) {
    var filterBackup = filterEl.style.filter;
    filterEl.style.filter = "";
    filterEl.style.filter = filterBackup;
    }

    filterEl.style.width = v + "%";
    valueEl.innerText = v + "%";
    }
    }window.onload = new Function("setSB(100,sb)")function fakeProgress(v, el) {
    if (v >= 100)
    setSB(100, el);
    else {
    setSB(v, el);
    window.setTimeout("fakeProgress(" + (v + 1) + ", document.all['" + el.id + "'])", 100);
    }
    }//-->
    </script>
    <div id="sb" style="border: 2 inset white; width: 200px; height: 20px; background: white; text-align: left;">
    <div id="sbChild1" style="position: absolute; width: 0%; height: 16px; filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=0);">
    <div style="width: 100%; height: 100%; background: highlight; font-size: 1;"></div>
    </div>
    <div style="position: absolute; width: 100%; text-align: center; font-family: arial; font-size: 12px; color: black;">0%</div>
    </div>
    <button onclick="fakeProgress(0, sb)">看效果</button>
      

  2.   

    http://www.xici.net/main.asp
    西祠的进度条，点击一个，就会出现
      

  3.   

    控件做出来的东西。<P>
    <OBJECT id=pb style="LEFT: 0px; WIDTH: 391px; TOP: 0px; HEIGHT: 50px" height=50 
    width=391 classid="clsid:0713E8D2-850A-101B-AFC0-4210102A8DA7" VIEWASTEXT>
    <PARAM NAME="_ExtentX" VALUE="10345">
    <PARAM NAME="_ExtentY" VALUE="1323">
    <PARAM NAME="_Version" VALUE="327682">
    <PARAM NAME="BorderStyle" VALUE="0">
    <PARAM NAME="Appearance" VALUE="1">
    <PARAM NAME="MousePointer" VALUE="0">
    <PARAM NAME="Enabled" VALUE="1">
    <PARAM NAME="OLEDropMode" VALUE="0">
    <PARAM NAME="Min" VALUE="0">
    <PARAM NAME="Max" VALUE="100"></OBJECT>
    </P><script>var counter = 0;function pro()
    {
    if (counter<100)
    {
    counter++;
    pb.Value = counter;
    setTimeout("pro()",100);
    }
    else
    {
    alert("progress end");
    }
    }
    pro();
    </script>
      

  4.   

    把如下代码加入到<body>区域中<form name="form">
    <p><input type="text" name="input" size="31" style="color: #008000; border-style: solid; border-width: 1" value="loading"></p>
    </form>
    <script>
    var num2=0;
    function serron()
    {num2++;
    myarray2=new Array('#2D2D2D','#494949','#646464','#747474','#888888','#969696','#A8A8A8','#B6B6B6','#C6C6C6','#D7D7D7','#E1E1E1','#F0F0F0','#F9F9F9')
    form.input.style.color=myarray2[num2-1];
    document.form.input.value+='■';
    if(num2<12) {setTimeout("serron()",1000);}
    else {window.open("http://www.jsshow.com","new");}
    }
    serron();
    </script>
      

  5.   

    刚写好的用滤镜和层的进度条，IE6下浏览可以看到滤镜效果，IE5下看不到滤镜效果，但是进度可以显示<span id=imgObj style="background-color:#339999; FILTER: progid:DXImageTransform.Microsoft.dropShadow( Color=DDDDDD,offX=3,offY=3,positive=true); FONT: bold 9pt/1.3 verdana; WIDTH: 0px; COLOR: darkred; HEIGHT: 15px"></span>
    <body onload="g()">
    <script>
    var fl = 0;
    function g()
    {
    if (fl<200)
    {
    imgObj.style.width = fl++;
    setTimeout("g()",10);
    }
    }
    </script>