Menu
I want to show my div (wrapper) when body is loaded. This is my code:
$("div.wrapper").hide();
$('body').load(function() {
$('.wrapper').show();
});
But my code not work. What is my mistake?
339
load() event is that the code included inside onload function will run once the entire page(images, iframes, stylesheets,etc) are loaded whereas the $(document). ready() event fires before all images,iframes etc. are loaded, but after the whole DOM itself is ready.
Definition and Usage The onload attribute fires when an object has been loaded. onload is most often used within the <body> element to execute a script once a web page has completely loaded all content (including images, script files, CSS files, etc.).
.ready() Specify a function to execute when the DOM is fully loaded.
So make your div invisible using css and make it visible using jQuery.
Html
<div class="wrapper" style="display:none">
<!-- your content -->
</div>
jQuery
$(document).ready(function() {
$('.wrapper').show();
});
Complete Sample
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript" src="PathToYourJqueryJsFile" />
<script type="text/javascript">
$(document).ready(function () {
$('.wrapper').show();
});
</script>
</head>
<body>
<div class="wrapper" style="display:none">
<!-- your content -->
</div>
</body>
</html>
First, set .wrapper {display:none} in your css file. Then, this code should show it after the page has loaded:
$(document).ready(function() {
$('.wrapper').show();
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
