问题
When a new page loads on my site, I want the main content (located within a div inside the body,as to exclude the footer and header) of the old page to fade out, and the main content of the new page to fade in, all by using jQuery. My code is basically:
<html>
<head> -random header info- (also where I figured the jQuery would go?)
</head>
<body>
<div id="header">
</div>
<div id="main"> - main content of site -
</div>
<div id="footer">
</div>
</body>
</html>
I only want the fade out and in to affect: <div id="main"> how can I do this?
回答1:
Try this, make sure to include jquery library as well.
$(document).ready(function(){
$("div#main").fadeOut();
});
To fade in, add style="display:none" to your div, and change fadeOut() to fadeIn().
回答2:
In your document.ready:- Fadeout:-
$('#main').fadeOut('slow');
FadeIn:-
$('#newcontent').fadeIn('slow');
来源：https://stackoverflow.com/questions/15561550/fade-out-in-div-on-page-load