如何在javascript中创建线性加载？

Question

我是javascript的新手，想在我的html页面中植入简单的衬垫加载，为此目的写下这段代码：

<div id="Back" style="width:100%;background-color:#1D1F20;height:5px;opacity:0.3;">
        <div id="sample" style="width:0%;background-color:#0099DA;height:5px;">
        </div>
    </div>
<script>
        $(document).ready(function () {
                $("#sample").animate({ "width": "100%" });
        });
        function LoadComplete() {
            alert('Load Complete');
        }
        window.onload = LoadComplete();
    </script>

想要直到网站完全加载，那个加载器显示给用户，页面完成加载后然后该加载器关闭，我该如何解决这个问题？谢谢大家。

Answer 1

1. 加载jquery库

2. 将#sample div放在脚本

   之后

   $（＆＃34; #sample＆＃34;）。animate（{＆＃34; width＆＃34;：＆＃34; 100％＆＃34;}）;

为什么它不起作用的原因是你在$（document）.ready函数中运行上面的函数，该函数在页面加载时执行。 所以你等待页面加载然后你运行你的加载器。这没有意义。