Can I make a link delay when it's clicked?

  • 1
  • Question
  • Updated 8 years ago
  • Answered
Hi, does anyone know any JavaScript to make links delay when they are clicked? What I want to do is when the link gets clicked, I want it to be active for 3 seconds or so, just like on my Yola. When you click a link that's in the navigation, it takes about 3 seconds for it to go that page. Does anyone know?

Thanks in advance!

___________________
Nathan Johnson
Photo of Nathan

Nathan, Champion

  • 3739 Posts
  • 307 Reply Likes
  • confident

Posted 8 years ago

  • 1
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hello Nathan

Hmm.. One thought that came to me is that you could do a redirect link with an onclick that take a few seconds? I forget where I have seen this but you can try googling it and hopefully that will yield some results.

I'll try to see if I can dig up that information and get back to you.
Photo of Nathan

Nathan, Champion

  • 3739 Posts
  • 307 Reply Likes
Thanks Sanja. What I want it to do is turn grey for a couple of seconds (this is in CSS, and it turns grey since it is active) I disabled JavaScript for a second and then went to my yola and clicked the nav. links in my yola and they went right away. But when JavaScript is enabled, the links take a second until they go to the page. I just wanted to do this for a little more style on my site with the links. I think it is a "JavaScript delay" or something. I searched it on Google but all there was where forms in the results and there weren't any answers on them. Maybe you will have more luck when you search. :)
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hello Nathan

I am not able to find something that seem to do what you want. I'm sorry.
Photo of lela

lela

  • 23 Posts
  • 6 Reply Likes
Can i make a link delay when it's clicked?
Photo of lela

lela

  • 23 Posts
  • 6 Reply Likes
Hi ,does anyone know any javascript to make links delay when they are clicked? what i want to do is when the link gets clicked.I want it to be active for 3 seconds or so ,just like on my yola. when you click a link that;s in the navigation, it takes about 3 seconds for it to go that page.does anyone know> thanks in advance
Photo of Nathan

Nathan, Champion

  • 3739 Posts
  • 307 Reply Likes
Hi lela, why do you keep going to all of the topics and saying the same exact topic details? Like you went to this one and it has the same thing I posted. Are you doing it by accident or something?
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hello Lela

You can add a redirect code on your site.

Here's what you need to do:

1. Create a new page with the name of the site you want to link to.
2. Drag and drop a HTML Widget onto your page.
3. Paste this tag into the HTML editor:
<!--<meta http-equiv="refresh" content="4; url=http://webdesign.about.com">-->

"4" is how many seconds it waits before it redirects - you can change this number.
"url" is the URL it redirects to, so, replace the URL in the above tag with the one for the site you want to link to.

*Please don't include the <!-- and -->. They are to stop the code from rendering.
Photo of Kevin

Kevin

  • 475 Posts
  • 29 Reply Likes
some javascript will do;
<!--<a href="#" onclick="setTimeout(window.document.location='http://www.yoursite.com',1250);">link...>
Photo of Kevin

Kevin

  • 475 Posts
  • 29 Reply Likes
please leave the href at #! edit the onclick="setTimeout(window.document.location='http://www.yoursite.com',1250);". the 1250 is milliseconds, so in this case it delays 1.25 seconds before going the http://www.yoursite.com. remember, it has to be in milliseconds!
Photo of Nathan

Nathan, Champion

  • 3739 Posts
  • 307 Reply Likes
Can I change it to regular seconds and not milliseconds?
Photo of l.breyers

l.breyers

  • 3 Posts
  • 0 Reply Likes
How do i make this work with the back.button function? Ive tried:

<!-- <a href="#" onclick="setTimeout(window.document.location='history.go(-1);return false, 3000);">
<img src="../myimage.jpg" width="200" height="100" /> </a> -->

with no success. Plz help!
Photo of Nazlie

Nazlie

  • 1721 Posts
  • 51 Reply Likes
Hi l.breyers

I have tested the code and it is working. You need to change the filepath of the image to <img src="resources/myimage.jpg" width="200" height="100" /> </a> so that it finds the image.

Hope this works for you as well. Let us know if you have any more problems!

Nazlie
Photo of l.breyers

l.breyers

  • 3 Posts
  • 0 Reply Likes
nm, the other script works, seems like its the window.document.location, the #, the missing ', and the improper formatting for setTimeout that was wrong.
Photo of Nathan

Nathan, Champion

  • 3739 Posts
  • 307 Reply Likes
Hi leave it at # and then add in the onclick return false right after the ; in the onclick. The return false makes it so no pound sign appears.

If you need help let me know.
Photo of Kevin

Kevin

  • 475 Posts
  • 29 Reply Likes
class, i don't think so. but what you could od is make a function and send a string to it. e.g; onclick="gotolink(www.google.ca). regular seconds is not possible, sorry
Photo of Nathan

Nathan, Champion

  • 3739 Posts
  • 307 Reply Likes
Thanks, I wonder if theres a way to make all links delay. It's ok.