Javascript Rotating Banner

Question

I am wanting to make a rotating banner using Javascript. This is intended to have advertisements on my website which have an image with a clickable link and changes every 5 seconds. I would like the banner to be 728x90. I would like to have the image and link files in the javascript file so if it needs to be modified, it can be easily without going through 100 html pages. Is there anyone that can help me out with this? I am very new to coding, so if someone can give me a basic walkthrough, that would be greatly appreciated.

Answer 1

To provide an image as link, you need to embedd it inside an anchor element.

<a id="ad-link" href="url to advertisements homepage" >
    <img id="ad-img" src="url to image">
</a>

To set the urls at runtime via JavaScript, you can simply do

document.getElementById("ad-link").setAttribute("href", "http://...");
document.getElementById("ad-img").setAttribute("src", "http://...");

To change the banner every 5 seconds, you need to define a timeout, after which a specific function is called.

setTimeout(function() {
    //update banner
}, 5000);

To rotate the banner, i recomend to use css. see How to do a webkit css endless rotation-animation.