• JavaScript模拟进度条


    <html>

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>进度条</title>
    </head>

    <body>

     
    ××××××××××注释以内的代码可以复制××开始××××××××××××
    <div id="progress"></div>
    <div id="DivFlash" style="display: none;">这里放上FLASH</div>

    <script type="text/javascript" language="javascript">
    <!--
    function CProgress(progressIdStr, min, max, pos)
    {
        this.progressIdStr = progressIdStr;
        this.progressId = document.getElementById(this.progressIdStr);
        this.barIdStr = progressIdStr + "_bar";
        this.barId = null;
       
        this.min = (min>=0)?min:0;
        this.max = (max>=min)?max:min;
        this.pos = (pos>=min && pos<=max)?pos:min;
        this.step = 1;
       
        this.progressWidth = 100;
        this.progressHeight = 15;
       
        this.Create = Create;

        this.SetStep = SetStep;
        this.SetPos = SetPos;
        this.Inc = Inc;
        this.Desc = Desc;
    }

    function Create()
    {
        if (document.all)
        {
            this.progressId.style.width = this.progressWidth+2;
        }
        else
        {
            this.progressId.style.width = this.progressWidth;
        }
        var pBgColor = '#0066FF';  //滚动条的颜色
        this.progressId.style.height = this.progressHeight;
        this.progressId.style.fontSize = this.progressHeight;
        this.progressId.style.border = "1px solid #000000";  //空白地方的颜色
        this.progressId.innerHTML = "<div id=\"" + this.barIdStr + "\" style=\"background-color:"+pBgColor+";height:100%;\"></div>";
        this.barId = document.getElementById(this.barIdStr);
        this.SetPos(this.pos);
    }

    function SetStep(step)
    {
        this.step = step;
    }

    function SetPos(pos)
    {
        pos = (pos<=this.max)?pos:this.max;
        pos = (pos>=this.min)?pos:this.min;
        this.barId.style.width = (this.progressWidth*pos)/this.max;
    }

    function Inc()
    {
        this.pos += this.step;
        this.SetPos(this.pos);
       if(this.pos >= progress.progressWidth)
       {
            document.getElementById('progress').style.display = 'none';
     document.getElementById('DivFlash').style.display = '';
           
       }
    }

    function Desc()
    {
        this.pos -= this.step;
        this.SetPos(this.pos);
    }

    var DivWidth = 600;//滚动条的宽度
    var DivTime  = 10; //滚动间隔时间 毫秒
    var Divaaa =    50;//滚动的长度
    var progress = new CProgress("progress", 0, DivWidth, Divaaa);
    progress.progressWidth = DivWidth;
    progress.Create();
    setInterval("progress.Inc();", DivTime);
    //-->
    </script>

    ××××××××××注释以内的代码可以复制××结束××××××××××××

    </body>

    </html>

    下电影就上 挖沙啦电影网 - 更多免费高清电影下载
  • 相关阅读:
    kafka 安装和基本操作
    IPv6表示方法及其简化方法
    Python print输出函数
    同步工具之Vector X
    golang之热加载Fresh&air X
    TOML 1.0格式语法 X
    PHPstorm配置webserver X
    编程辅助工具之Kite X
    golang项目之Makefile X
    高性能消息队列之nsq X
  • 原文地址:https://www.cnblogs.com/zzmzaizai/p/1204569.html
Copyright © 2020-2023  润新知