js 网页加载进度条效果

最新推荐文章于 2023-11-09 11:24:12 发布

残月晓风101

最新推荐文章于 2023-11-09 11:24:12 发布

阅读量437

点赞数

分类专栏： js 特效笔记文章标签： javascript js 前端

本文链接：https://blog.csdn.net/u014788344/article/details/45313205

版权

js 特效笔记专栏收录该内容

1 篇文章 0 订阅

订阅专栏

着重是 document.loading.chart.value document=> 文档 loading=> form的name chart=> input的name

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<form name=loading>
    <td align=center>
       <h3 color=gray>程子，正在载入首页，请稍候.......</h3>
        <p>
            <input type=text name=chart size=46 style="font-family:Arial;
font-weight:bolder; color:gray;
 background-color:white; padding:0px; border-style:none;">
            <br>
            <input type=text name=percent size=46 style="font-family:Arial;
color:gray; text-align:center;
border-width:medium; border-style:none;">

        </p>
    </td>
</form>
<script
    >

    var bar =0;
    var line ="||";
    var amount ="||";

    function count(){
        bar =bar+2;
        amount =amount +line;
        /*网页加载进度条*/
        document.loading.chart.value=amount
        document.loading.percent.value=bar+"%"
        if(bar <99){
            setTimeout("count()",100);
        }else{
            window.location ="http://www.baidu.com";
        }
    }
    count();

    
    </script>
</body>
</html>