Fade out Div, Load content then Fade in
Ok... i'm only very new to jquery and im only finding my feet. I have tried for 2 days... tried reading the jquery docs site for help, but nadda.
This is my site as it is now
http://www.thebigempty.net
This is the code im using
-
<script type="text/javascript">
function loadContent(id) {
$("#mainbodycont").fadeOut("slow", callback(id)).fadeIn("slow");
$("#nav").fadeOut("slow", callback(id)).fadeIn("slow");
}
function callback(id) {
$("#mainbodycont").load("data.php?o="+id+"");
$("#nav").load("dataicon.php?o="+id+"");
}
function loadContentonload(id) {
$("#mainbodycont").load("data.php?o="+id+"");
$("#nav").load("dataicon.php?o="+id+"");
}
</script>
Then this to load the content first up.
-
<body onload="javascript:loadContentonload(1);">
Then this to load content from the links
-
<a href="javascript:loadContent(2);">Home</a>
Sooo the problem is... i want the div to fade out, load the content and then when the content is loaded completely, fade back in.
Thanks
Mike