Hi,
Can someone point me in the direction to hook the DOM loaded event?
Basically, i want to display a loader while the dom is loading (I dont mean Ajax requests- the first time a user hits a page) ?
Thanks all in advance
+2
A:
All of the popular Javascript libraries have a "DOM loaded" event you can use for this.
Essentially:
<html>
<head>
<script>
// if using jQuery
$(document).ready(function() { $('#loading').hide(); });
// if using Prototype
document.observe("dom:loaded", function() { $('loading').hide(); });
</script>
</head>
<body>
<div id="loading">Loading...</div>
<!-- rest of page -->
</body>
</html>
Paolo Bergantino
2009-02-24 16:27:56
A:
Just to provide an alternative to jQuery, YUI Event provides an onDomReady() function for this purpose as well. Here's the example from their site:
<script type="text/javascript">
function init() {
YAHOO.util.Dom.setStyle("hidden_element", "visibility", "");
}
YAHOO.util.Event.onDOMReady(init);
</script>
Daniel Lew
2009-02-24 16:53:28
A:
but if the div id="loading" is dynamically created?
I have href that I create in table and I want to handle the event of the href
tali
2009-07-12 14:33:59
A:
The proper way to do this without a library (and really, even with a library, since you're dealing with script blocking and IE unpredictability) is to put a script at the very end of the page:
onLoaded = function(){ ... }onLoaded()
mwilcox
2010-06-18 12:44:42