Javascript 如何仅在页面加载时在的特定div中显示加载程序_Javascript_Jquery_Html_Css

Javascript 如何仅在页面加载时在的特定div中显示加载程序

javascript jquery html css

Javascript 如何仅在页面加载时在的特定div中显示加载程序,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我有以下html <body> <div class="menus"></div> <div class="maincontent"></div> <div class="footer"></div> </body> 现在当页面加载时，我想显示div类菜单和页脚，直到页面在divmaincontent中加载加载程序图像。我该如何做到这一点？我尝试将loader div放在maincontent中，并

我有以下html

<body>
<div class="menus"></div>
<div class="maincontent"></div>
<div class="footer"></div>
</body>

现在当页面加载时，我想显示div类菜单和页脚，直到页面在divmaincontent中加载加载程序图像。我该如何做到这一点？我尝试将loader div放在maincontent中，并使用$window.loadfunction{}，但没有效果。欢迎提出任何想法和建议。

这应该是初始HTML

<body>
<div class="menus"></div>
<img src="ajaxloader.gif" class="loader" style="display:block"/>
<div class="maincontent" style="display:none">
</div>
<div class="footer"></div>
</body>

试试这个

$(document).ready(function(){    
$(".maincontent").fadeOut( "slow"); 
$(".menus,.footer").fadeIn("slow", function() {
     $(this).text("menu, footer"); 
}); 
});

加载窗口后，加载图像的主要内容隐藏并显示菜单、页脚

参见

$(document).ready(function(){    
$(".maincontent").fadeOut( "slow"); 
$(".menus,.footer").fadeIn("slow", function() {
     $(this).text("menu, footer"); 
}); 
});