0

我首先想到的是制作一个容器，并在页面加载开始时让它充满屏幕，而元素仍然在预加载掩码后面加载，比如

    var window_width = $(window).width();
    var window_height = $(window).height();

    $('.pre-modal-window').each(function () {

        var modal_height = parseInt($('.pre-modal-window').css("height"));
        var modal_width = parseInt($('.pre-modal-window').css("width"));

        var top = (window_height - modal_height) / 2;
        var left = (window_width - modal_width) / 2;

        $(this).css({ 'top': top, 'left': left });

    })

        //set display to block and opacity to 0 so we can use fadeTo
        $('#pre-mask').css({ 'display': 'block', opacity: 0 }).fadeTo(50, 1.0);

        //show the modal window
        $('.pre-modal-window').fadeIn(500);

使用 SetInterval() 函数设置它几秒钟后消失（我知道这是假的，但我不知道如何判断元素已经下载......）。

它就像jquery插件queryloader。但是，它在我的项目中效果不佳。所以我想自己写一个

上面描述的想法只有在页面中只有很少的元素时才有效，当元素变得越来越多时，效果就不再起作用了……我怎样才能让它在页面开始下载时显示出来？顺便说一句，我该怎么做判断所有元素都已经下载了吗？谢谢

4

1 回答 1

2

查看文档的 jQuery 的 .ready() 函数：http: //api.jquery.com/ready/

来自 jQuery API：指定在 DOM 完全加载时执行的函数。

一个例子如下：

<script type="text/javascript">
$(document).ready(function() {
  // hide the loading mask here.
});
</script>
于 2011-03-01T11:53:37.940 回答