动画在页面加载后开始

Question

有一个母版页和一些内容页。在导航时，我希望页面在加载时具有淡入效果。单击链接时，页面首先出现，然后淡出效果开始，但应该是另一种方式。

JS：

$(window).load(function(){
 $(".divLoading").fadeOut(2000);
});

ASPX：

<asp:Content ID="content" ContentPlaceHolderID="" runat="server">
<div class="divLoading"></div>
   //all the page content comes here

CSS：

.divLoading
{
 width:100%;
height:100%;
background:white;
z-index:1000;
position:fixed;
}

我也尝试将JS和div放在母版页而不是每个内容页面中，但它是相同的。

Answer 1

您使用的高度百分比似乎无效。添加以下css：

html,body{
height: 100%;
}

Answer 2

您可以使用div（例如<div id="divLoading">）包装您的内容，并在您的CSS中添加：

CSS：

 div#divLoading { display: none; }

jQuery的：

 $(document).ready(function(){  
        $('#divLoading').fadeIn(2000);
    });

See demo