'I want to delay a link for a period of 500 with javascript

I've been looking through the Stackoverflow questions, trying to get help with a simple link delay; I want to put it around a div, and I can't make heads or tails of the examples I've found.

So far, I understand that I need to halt the native function of href, but I don't know how to do that. The code is still very alien to me. Help?

javascripthtmltimehyperlinkdelay


Solution 1:[1]

Set your href attribute as href="javascript:delay('URL')" and JavaScript:

function delay (URL) {
    setTimeout( function() { window.location = URL }, 500 );
}

Solution 2:[2]

If you want to delay every link on your page, you can do it with jQuery like this

$(function(){
    $("a").click(function(evt){
        var link = $(this).attr("href");
        setTimeout(function() {
            window.location.href = link;
        }, 500);
    });
});

Solution 3:[3]

I use this to keep the function waiting before continuing:

var wait_until = new Date().getTime() + 500;
while (new Date().getTime() < wait_until) {
    //Do nothing, wait
}

Solution 4:[4]

To delay a link with inline javascript, just set your href attribute as href="javascript:setTimeout(()=>{window.location = 'URL' },500);".

When you replace the URL with your link, just make sure it is inside the ' '.

<li class="nav-item">
  <a href="javascript:setTimeout(()=>{window.location = '#About' },500);">
    About Me
  </a>
</li>

Solution 5:[5]

If you want to open on a new tab (target="_blank"),

This would be @gurvinder372's code changed to account for the new tab:

If you want to use any other target setting, just change the "_blank" to your preferred setting.
function delay(URL) {
    setTimeout(function () {
        window.open(URL, "_blank"); // this is what I've changed.
    }, 500);
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 VisioN
Solution 2 ttkalec
Solution 3 nebulousGirl
Solution 4
Solution 5 sebmandal

Related Questions