javascript - 如何使用 javascript/jQuery 更快地加载我的加载符号

Question

当有人访问我的页面时，我会在屏幕上显示一个正在加载的 gif。它看起来像这样:

<style type="text/css">
    #dvLoading
    {
        background: url(../images/loader.gif) no-repeat center center;
        height: 100px;
        width: 100px;
        position: fixed;
        z-index: 1000;
        left: 50%;
        top: 50%;
        margin: -25px 0 0 -25px;
    }
</style>

我的 JavaScript 显示如下:

<script class="code" language="javascript" type="text/javascript">

    $(window).load(function () {
        $('#dvLoading').fadeOut(2000);
    });
</script>

但是，似乎页面已加载，然后加载 gif 会短暂出现。除了 .load 之外，还有更好的事件可以为我完成这项工作吗？

Answer 1

按照您现在的方式，您将无法达到这种效果。因为您的样式和 JavaScript 会随页面一起加载，所以当您显示加载动画时，所有内容都已加载。实现目标的唯一方法是使用加载指示器和 javascript 加载空 html shell，该 javascript 将通过异步 ($.ajax) 请求请求其余的 html，这样您就可以在发出异步请求后显示加载指示器获取 html 并在异步请求完成时隐藏它。