View Full Version : delay on link?

06-26-2012, 09:21 PM
How would I set a delay on a link? Say I click on a link <a href="test.html">link</a> , and I want test.html to load 3 seconds after I click that link?

Philip M
06-26-2012, 09:56 PM
<a href="#" onclick="setTimeout(window.document.location='test.html',3000);">link</a>

But what is the point? The user will wonder why the link has not worked.

All advice is supplied packaged by intellectual weight, and not by volume. Contents may settle slightly in transit.

Old Pedant
06-27-2012, 03:55 AM
Ummm...nope, not quite, Philip.

That window.document.location='test.html' will execute when the setTimeout is called, not 3 seconds later.

If you don't simply pass a function reference to setTimeout, you must pass literal code wrapped in quotes.

Easy fix:

<a href="#" onclick="setTimeout('window.document.location=\'test.html\';',3000);return false;">link</a>

Or you could do (a bit cleaner)

<a href="#"
onclick="setTimeout(function(){window.document.location='test.html';},3000);return false;"

In either case, you want the return false there to prevent the browser from jumping to the top of the pages, as it would do because of the href="#".

06-27-2012, 07:43 AM
Philip, the reason I want to do this is to allow a short animation to play before the page loads. Old Pedant, thank you, this does work, just one small thing. Is there a way to have the link in the status bar to match the url that the link is going to? Currently when I mouse over the link, the status bar displays the current page's url with a # on the end of it. Instead I want the status bar to show the url that the link will actually take you to ( http://resin.webs.com/test.html ). How would I do this?

Old Pedant
06-27-2012, 10:38 PM
<a href="test.html"
onclick="setTimeout(function(){window.document.location='test.html';},3000);return false;"

The URL that is in the href won't be used, anyway, so you can make it whatever you want. Just have it match your actual target page, for example.