Posted By

ishikawa on 04/28/08


Tagged

DOM xbs


Versions (?)


Advertising

Website Promotion DIRECTORY is a crucial factor for all websites that need to gain better organic search engine rankings and increase website traffic.
Submitting your website as part of your Web Promotion strategy to our SEO friendly and high traffic Business Directory for review is an excellent way to gain a valuable backlink and increase your websites visibility online.

Submit Site


Who likes this?

9 people have marked this snippet as a favorite

inamorix
hariharank12
heinz1959
rodi01
kcmr
rafael
durvalagnelo
chianess
Jman


domready.js


Published in: JavaScript 






URL: http://www.metareal.org/2007/07/10/domready-js-cross-browser-ondomcontentloaded/

This is a pretty simple example for cross browser dom:ready event handling inspired by mootools.

Expand | Embed | Plain Text
  1. /**
  2.  * domready.js
  3.  *
  4.  * Cross browser mozilla's 'onDOMContentLoaded' implementation.
  5.  * Executes a function when the dom tree is loaded without waiting for images.
  6.  *
  7.  * Based on +Element.Events.domready+ from Mootools open source project,
  8.  * this tiny javascript library adds the emulated 'DOMContentLoaded' functionality.
  9.  *
  10.  * Features:
  11.  * - No dependency on external libraries
  12.  * - Compatible with Prototype.js
  13.  *
  14.  * Tested browsers (Windows):
  15.  * - IE 7 (XP standalone)
  16.  * - IE 6 SP2
  17.  * - Firefox 2.0.0.4
  18.  * - Opera 9.21
  19.  *
  20.  * Tested browsers (Mac OS X):
  21.  * - Safari 2.0.4
  22.  * - Firefox 2.0.0.4
  23.  * - Mac Opera 9.21
  24.  * - Mac IE 5.2.3
  25.  *
  26.  * Copyright (c) 2007 Takanori Ishikawa.
  27.  * License: MIT-style license.
  28.  *
  29.  * MooTools Copyright:
  30.  * copyright (c) 2007 Valerio Proietti, <http://mad4milk.net>
  31.  *
  32.  *
  33.  * See Also:
  34.  *
  35.  * mootools
  36.  * http://mootools.net/
  37.  *
  38.  * The window.onload Problem - Solved!
  39.  * http://dean.edwards.name/weblog/2005/09/busted/
  40.  *
  41.  * [PATCH] Faster onload for Event.onload
  42.  * http://dev.rubyonrails.org/ticket/5414
  43.  * Changeset 6596: Support for "DOMContentLoaded" event handling (prototype.js event branch)
  44.  * http://dev.rubyonrails.org/changeset/6596
  45.  *
  46.  */
  47.  
  48. if (typeof Event == 'undefined') Event = new Object();
  49.  
  50. /*
  51.  * Registers function +fn+ will be executed when the dom
  52.  * tree is loaded without waiting for images.
  53.  *
  54.  * Example:
  55.  *
  56.  * Event.domReady.add(function() {
  57.  * ...
  58.  * });
  59.  *
  60.  */
  61. Event.domReady = {
  62. add: function(fn) {
  63.  
  64. //-----------------------------------------------------------
  65. // Already loaded?
  66. //-----------------------------------------------------------
  67. if (Event.domReady.loaded) return fn();
  68.  
  69. //-----------------------------------------------------------
  70. // Observers
  71. //-----------------------------------------------------------
  72. var observers = Event.domReady.observers;
  73. if (!observers) observers = Event.domReady.observers = [];
  74. // Array#push is not supported by Mac IE 5
  75. observers[observers.length] = fn;
  76.  
  77. //-----------------------------------------------------------
  78. // domReady function
  79. //-----------------------------------------------------------
  80. if (Event.domReady.callback) return;
  81. Event.domReady.callback = function() {
  82. if (Event.domReady.loaded) return;
  83.  
  84. Event.domReady.loaded = true;
  85. if (Event.domReady.timer) {
  86. clearInterval(Event.domReady.timer);
  87. Event.domReady.timer = null;
  88. }
  89.  
  90. var observers = Event.domReady.observers;
  91. for (var i = 0, length = observers.length; i < length; i++) {
  92. var fn = observers[i];
  93. observers[i] = null;
  94. fn(); // make 'this' as window
  95. }
  96. Event.domReady.callback = Event.domReady.observers = null;
  97. };
  98.  
  99. //-----------------------------------------------------------
  100. // Emulates 'onDOMContentLoaded'
  101. //-----------------------------------------------------------
  102. var ie = !!(window.attachEvent && !window.opera);
  103. var webkit = navigator.userAgent.indexOf('AppleWebKit/') > -1;
  104.  
  105. if (document.readyState && webkit) {
  106.  
  107. // Apple WebKit (Safari, OmniWeb, ...)
  108. Event.domReady.timer = setInterval(function() {
  109. var state = document.readyState;
  110. if (state == 'loaded' || state == 'complete') {
  111. Event.domReady.callback();
  112. }
  113. }, 50);
  114.  
  115. } else if (document.readyState && ie) {
  116.  
  117. // Windows IE
  118. var src = (window.location.protocol == 'https:') ? '://0' : 'javascript:void(0)';
  119. document.write(
  120. '<script type="text/javascript" defer="defer" src="' + src + '" ' +
  121. 'onreadystatechange="if (this.readyState == \'complete\') Event.domReady.callback();"' +
  122. '><\/script>');
  123.  
  124. } else {
  125.  
  126. if (window.addEventListener) {
  127. // for Mozilla browsers, Opera 9
  128. document.addEventListener("DOMContentLoaded", Event.domReady.callback, false);
  129. // Fail safe
  130. window.addEventListener("load", Event.domReady.callback, false);
  131. } else if (window.attachEvent) {
  132. window.attachEvent('onload', Event.domReady.callback);
  133. } else {
  134. // Legacy browsers (e.g. Mac IE 5)
  135. var fn = window.onload;
  136. window.onload = function() {
  137. Event.domReady.callback();
  138. if (fn) fn();
  139. }
  140. }
  141.  
  142. }
  143.  
  144. }
  145. }

Report this snippet 

You need to login to post a comment.

Download royalty free graphics