CODEWITHSUNDEEP
javascriptjquerycss-animations
Bayron2304
Bayron2304

Reputation: 113

Page load out animation

Hi guys I have a question about running an animation whenever a user clicks a link to a different webpage. The problem is that I don't know how to set a dynamic Window.location. Currently my code looks like this 

$('.url').click(function(){
$('.page-load-animation').addClass('page-load-out');
  setTimeout(function() {
        window.location.href = "www.bayron.nl/recepten-toevoegen-template.html";
    }, 2000);
});

This does what I want but it only redirects to a specified webpage. How can I make the URL dynamic so that the users will be redirected to the page of the link that they clicked?

Thanks!

Upvotes: 0

Views: 74

Answers (2)

Bayron2304
Bayron2304

Reputation: 113

@katniss.everbean gave me the answer. If anyone out there is searching for the quick answer, this is what my code looks like. And it works

    $('.url').click(function(){

    var linkLocation = this.href;

    $('.page-load-animation').addClass('page-load-out');
  setTimeout(function() {
        window.location.href = linkLocation;
    }, 2000);
});

Upvotes: 1

pavithra
pavithra

Reputation: 336

html part 

 <div class="url" link="http://www.bayron.nl/recepten-toevoegen-template.html">test page</div>
 <div class="url" link="http://www.bayron.nl/recepten-toevoegen-templatepage2.html">test page2</div>

javascript part

$('.url').click(function(){
url = $(this).attr("link")
$('.page-load-animation').addClass('page-load-out');
  setTimeout(function() {

        window.location.href =url;
    }, 2000);
});

is this what you want

Upvotes: 0

Related Questions