javascript - Web 应用程序加载屏幕

Question

我有一个有几个树视图的网络应用程序。当页面加载时，我看到了无序列表，经过一小段延迟后，树的样式被渲染到 DOM 中。

有没有办法屏蔽 web 应用程序，并在屏幕中间有一个微调器，当页面上的所有内容完全呈现时，微调器消失并且掩码淡出？有点像您会在灯箱弹出对话框中看到的半透明蒙版。

Answer 1

如果它是半透明的，您仍然会看到问题。添加

<div id="loadingmask"></div>

之前</body>。如果您设置了其他 z-index，则可能需要调整其 z-index。

CSS：

#loadingmask
{
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    background:#000 url(yourspinner.gif) center no-repeat;

}

jQ // 当其他所有事情都完成时

$('#loadingmask').fadeOut(500, function(){ $(this).remove(); });

​</p>