JS Question: Delay triggering function

[TechBoyJK]

I have an overlay+ spinner setup for a site I'm building and I want to set it up so that when someone clicks a link, the overlay and spinner come up.

However, quite a few of the pages are practically instant loads, so by time the overlay renders, the new page is ready so it's just a meaningless flicker that appears.

Here's what I have now. This fires the overlay for everything. I just want it to fire if it takes more than 2 seconds to render the next page.

<script type="text/javascript">
$(document).ready(function() {
	$('a').click( function() {
		$(window).spin();} 
	);
});
</script>

Here's what I've found via googling, but this instead makes the overlay popup after 1 second of viewing the page... Any advise?

<script type="text/javascript">
	$(document).ready(function() {
		$('a').click( 
			setTimeout(function() {$(window).spin();}, 1000)
		);
	});
</script>

 

[MrChad]

Are these links loading subframes? New windows? Invoking some sort of AJAX function?

For frames and windows, the proper way to do it would be to set up the spinner, load the page, then hook into the onload event of the frame or window to stop the spinner. This won't work if the frames or windows belong to a different domain however.

For an AJAX call, you start the spinner, fire the AJAX call, then stop the spinner in the callback function for the AJAX call.

 

[TechBoyJK]

Are these links loading subframes? New windows? Invoking some sort of AJAX function?

For frames and windows, the proper way to do it would be to set up the spinner, load the page, then hook into the onload event of the frame or window to stop the spinner. This won't work if the frames or windows belong to a different domain however.

For an AJAX call, you start the spinner, fire the AJAX call, then stop the spinner in the callback function for the AJAX call.

No it's literally for just straight links. If someone clicks on a link, (a href) I want an overlay with spinner to come up, but I just want it to wait 1 second before it does since many of the pages will load instantly. For those pages, the overlay just flickers and doesn't fully render because the new page is already fetched and rendered.

 

[MrChad]

No it's literally for just straight links. If someone clicks on a link, (a href) I want an overlay with spinner to come up, but I just want it to wait 1 second before it does since many of the pages will load instantly. For those pages, the overlay just flickers and doesn't fully render because the new page is already fetched and rendered.

Let me rephrase my question. Are your links targeting a subframe or new window? Or are you reloading the entire top window?

 

[TechBoyJK]

new window