JavaScript进度条

来源：互联网发布：数据库镜像同步编辑：程序博客网时间：2024/05/22 05:13

<html><head>    <title>进度条</title>    <style type="text/css">        .loadbar{            width:450px;            background:#c6dcfa;            height:20px;            border-radius:10px ;        }        #bar{            background:#4d8ef0;            float:left;            height: 20px;            text-align:center;            border-radius:10px ;            font-family: arial;            color: #FFFFFF;            font-size: 14px;            line-height: 20px;        }    </style>    <script type="text/javascript">        function setProcess(){            var processbar = document.getElementById("bar");            processbar.style.width = parseInt(processbar.style.width) + 1 + "%";            processbar.innerHTML = processbar.style.width;            if(processbar.style.width == "30%"){                window.clearInterval(bartimer);            }        }        var bartimer = window.setInterval(function(){setProcess();},50);        window.onload = function(){            bartimer;        }    </script></head><body><div class="loadbar">    <div id="bar" style="width:0%;"></div></div></body></html>

阅读全文

0 0