Skip to content

Instantly share code, notes, and snippets.

@ahsquared

ahsquared/defer_doc_ready_jquery.html

Created April 26, 2012 05:51
Show Gist options
  • Save ahsquared/2496346 to your computer and use it in GitHub Desktop.
Save ahsquared/2496346 to your computer and use it in GitHub Desktop.
Download ZIP
Defer a document ready call
Raw
defer_doc_ready_jquery.html
<!DOCTYPE html>
<html lang="en">
<head>
<!-- this collects the jquery document ready calls
// used with gratitude from: http://blog.colin-gourlay.com/blog/2012/02/safely-using-ready-before-including-jquery/ -->
<script>(function (w, d, u) { w.readyQ = []; w.bindReadyQ = []; function p(x, y) { if (x == "ready") { w.bindReadyQ.push(y); } else { w.readyQ.push(x); } }; var a = { ready: p, bind: p }; w.$ = w.jQuery = function (f) { if (f === d || f === u) { return a } else { p(f) } } })(window, document)</script>
</head>
<body>
<!-- this is on the page and you want to defer it -->
<script type="text/javascript">
$(document).ready(function () {
(function () {
var doc_ready = $.Deferred();
$(doc_ready.resolve);
$.when(doc_ready).then(function () {
console.log("defer done");
});
})();
});
</script>
<!-- at the bottom of the page
// load jquery -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script defer src="main.js"></script>
// this calls the collected document readies from the top
<script>(function ($, d) { $.each(readyQ, function (i, f) { $(f) }); $.each(bindReadyQ, function (i, f) { $(d).bind("ready", f) }) })(jQuery, document)</script>
</body>
</html>
Raw
main.js
$(document).ready(function() {
console.log('ready done');
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment