Lets take a static html page as a scenario, lets say you have a DIV element that you wish to only render fully within a users browser AFTER all its content has already been fully loaded instead of having bits and pieces of it appear. Any ideas appreciated! thanks
+1
A:
I would use jQuery, the DIV would have a style of display:none, and my body onLoad function would set the display to block.
Fosco
2010-07-07 20:15:59
A:
trigger your code after the dom ready event. Link here for more details.
Teja Kantamneni
2010-07-07 20:17:19
+1
A:
Hide the DIVs and show them with JavaScript when onload fires. E.g.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript">
function showHidden() {
document.getElementById("cantseeme").style.display='block'; // Show it
}
</script>
</head>
<body onload="showHidden();">
<div id="cantseeme" style="display:none;">Hidden element</div>
</body>
</html>
Gert G
2010-07-07 20:29:23
thanks thats very helpful
sebrox
2010-07-07 20:51:16
No problem and thanks. JavaScript always comes handy when you need to modify the page in one way or another. :)
Gert G
2010-07-07 20:54:23
Rather than using onload, if you put the script at the very end of the file, after the body, wouldn't that achieve the same effect?
Will
2010-07-07 21:12:39
@Will - Putting it at the end might trigger while images and objects are still loading. That's why it's better to trigger it `onload`.
Gert G
2010-07-07 22:26:44