<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="http://www.contrast.ie/blog/wp-content/uploads/2009/09/spidermonkey-example.css" type="text/css" media="screen" charset="utf-8" />
<link rel="stylesheet" href="http://www.contrast.ie/blog/wp-content/themes/sandbox/assets/css/screen/style.css" type="text/css" media="screen" charset="utf-8" />
<script type="text/javascript">
var waitForMe = {
lastClick: null,
listener : function(e) {
e.stopPropagation();
e.preventDefault();
waitForMe.lastClick = e;
},
onLoad : function() {
waitForMe.detach();
$('#loading-notice').addClass('finished_loading');
$('#loading-notice').html("Loaded");
if (waitForMe.lastClick) {
var fireOnThis = waitForMe.lastClick.target;
var evObj = document.createEvent('MouseEvents');
evObj.initEvent('click', true, true);
fireOnThis.dispatchEvent(evObj);
}
},
attach : function() {
if (document.addEventListener)
document.addEventListener('click', waitForMe.listener, true);
},
detach : function() {
if (document.removeEventListener)
document.removeEventListener('click', waitForMe.listener, true);
}
};
waitForMe.attach();
</script>
</head>
<body>
<div id="Page">
<div id="loading-notice">Loading...</div>
<p>Click a link while loading and it will be handled after loading is finished.</p>
<p><a href="/some_other_page_that_doesnt_exist" class="link">Link 1</a> <a href="/some_other_page_that_doesnt_exist" class="link">Link 2</a> <a href="/some_other_page_that_doesnt_exist" class="link">Link 3</a> </p>
<div id="message"></div>
</div>
<p style="text-align:center;">Can you make it work on Internet Explorer? <a href="http://gist.github.com/gists/183593">fork this gist</a>.</p>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript">
$(function() {
$('.link').click(function() {
$('#message').html("Just handled click on: " + $(this).text());
return false;
});
setTimeout(function(){
waitForMe.onLoad();
}, 5000);
});
</script>
</body>
</html>
) is private.
