在没有动画a-tag的情况下，但在动画播放完毕后，建立到其他页面的超链接

Question

I would like to make a web banner and I want it to have a hyperlink to an other page.

Sounds like an easy task? Yes, but I can't use the HTML tag because I don't want to go to an other page started by a click event.

I want to link to an other page after an animation finished playing.

I'm hoping for a JS solution (if it's possible).

so:

First: I want to drag and drop an html-element,

Second: I want to play an CSS/JS animation,

Third: I want to hyperlink to an other page, (this is the part were in need help).

I don't have any code an don't ask to write it for me, I just want to know how to make a hyperlink without clicking something.

I have found an similar question Here , but it doesn't cover what I'm looking for. I want to link after the user interacted.

Answer 1

You set the window.location.href="http://www.stackoverflow.com";

Here is an example of how you would do it at the end of an animation using jQuery.

JavaScript

$("#startAnimation").on('click',function(){
  $("#bunny").slideDown(1000,function(){
    window.location.href="http://www.stackoverflow.com";
  });

});

CSS

#bunny {  
  display:none;
}

HTML

  <div id="bunny"><img src="http://i.guim.co.uk/static/w-620/h--/q-95/sys-images/Guardian/Pix/pictures/2010/8/5/1281041145130/Farms-wildlife-schemes-bo-006.jpg"/></div>
<div>
    <button id="startAnimation" type="button">Start animation</button>
</div>

See the JSBin

Answer 2

After the animation has finished playing, you can run a script that would redirect the user to another page:

window.location.href = 'your_page.html';