CODEWITHSUNDEEP
jqueryhtml
Laniakea
Laniakea

Reputation: 884

How to give all my web page links opening delay?

I'd like to know if anyone has had any experience with time delays? I'm trying to get all my global links to open with a time delay. Just to give it an artistic effect, make it swap pages more smoothly.But for some reason I cannot get it working. I'd appreciate any help I can get.

HTML:

    <!DOCTYPE html>
<html lang="en-US">
    <head>
    <meta charset="utf8" />
        <link rel="stylesheet" type="text/css" media="all" href="css/mainstyle.css"/>
        <meta name="viewport" content="initial-scale=1" />
        <title> Redneck Rampage </title>
    </head>
    <body class="filter">
    <div id="background"> 
        <div id="wrapper">
            <div class="navigation">
                <ul id="mainmenu">
                    <li class="active"><a href="index.html">Home</a></li>   
            <li><a href="band.html">Band</a></li>  
            <li><a href="news.html">News</a></li>
                    <li><a href="shows.html">Shows</a></li>
                    <li><a href="music.html">Music</a></li>
                    <li><a href="gallery.html">Gallery</a></li>
                    <li><a href="media.html">Media</a></li>
                    <li><a href="store.html">Store</a></li>

                </ul>
            </div>

                <div class="footer homepage">
                    <p class="rednecks">Website and Contents &copy; Redneck Rampage 2013. </p>
                    <p class="signature">Designed by Martin Metsalu </p>

                        <ul id="footermenu">
                            <li><a href="terms.html">Terms of use</a></li>
                            <li><a href="privacy.html">Privacy Policy</a></li>
                            <li><a href="contact.html">Contact</a></li>
                       </ul>
                    <div class="socialplugins">
                        <div class="test"><a href="#"><img src="IMG/soundcloud.png" alt="plugin#1" ></a></div>        
                        <div class="test"><a href="#"><img src="IMG/youtube.png" alt="plugin#2"></a></div>
                        <div class="test"><a href="#"><img src="IMG/myspace.png" alt="plugin#3"></a></div>
                        <div class="test"><a href="#"><img src="IMG/facebook.png" alt="plugin#4"></a></div>

                    </div>

                </div>
         </div>
    </div>
</body>
</html>

JQUERY:

        $('a').click(function(e) {
$('a[href*="/steve"]').each(function(index) {
    setTimeout(
         function(href){window.open(href)},
         (index+1)*5000, $(this).attr('href')
    );
});

Upvotes: 0

Views: 1175

Answers (2)

whitneyit
whitneyit

Reputation: 1226

$( 'a[href*="/steve"]' ).each( function () {
    $( this ).on( 'click', function ( event ) {
        event.preventDefault();
        ( function ( h ) {
            setTimeout( function () {
                window.location = h;
            }, 5000 );
        })( this.href );
    });
});

Give that a try.

Upvotes: 1

BostonJohn
BostonJohn

Reputation: 2671

I think you just need to do e.preventDefault(); at the top of your click function

Upvotes: 0

Related Questions