Rotating Advertisement Banner Help

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. So far this is what I have but am still having some issues. I pulled this code from another forum on an older post and am a little unsure what parts to fill out. I just filled in the http links as an example, I was just using pages from my site original for a test run. The images on the other hand, that is the source to the files. The image does not want to show up, however there is a box. And when I click on the box, it says no file exists at that address...

<a id="ad-link" href="url to advertisements homepage" >

    <img class="advertisement" id="ad-img" src="url to image">
</a>

HTML:

document.getElementById("ad-link").setAttribute("href", "http://advertisementspaceforrent1, http://advertisementspaceforrent2");
document.getElementById("ad-img").setAttribute("src", "images/advertisementspaceforrent1.png, images/advertisementspaceforrent1.png");
setTimeout(function() {
    //update banner
}, 5000);

Code (JavaScript):

.advertisement {
    height: 90px;
    width: 728px;
    float: center;
}

Code (CSS):

 

Since you're already looking for a query solution, I suppose you can do something like this. It works with all banner sizes:

Demo: http://jsfiddle.net/xDZPK/151/

HTML:

    <div id="slider">
        <a href="#">
            <img src="http://placehold.it/729x90&text=Slide+1"/>
        </a>
        <a href="#">
            <img src="http://placehold.it/300x250&text=Slide+2"/>
        </a>
        <a href="#">
            <img src="http://placehold.it/729x90&text=Slide+3"/>
        </a>
        <a href="#">
            <img src="http://placehold.it/250x250&text=Slide+4"/>
        </a>
        <a href="#">
            <img src="http://placehold.it/468x60&text=Slide+5"/>
        </a>
        <a href="#">
            <img src="http://placehold.it/200x200&text=Slide+6"/>
        </a>
    </div>

Code (markup):

CSS:

#slider a{
    display: none;
}

Code (markup):

JS:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script>
$(document).ready(function(){

    $("#slider a").first().show();

    var index = 0;
    var count = 5;

    function bannerRotator() {
        $('#slider a').delay(4300).eq(index).fadeOut(function() { 
            if (index === count){
                index = -1;
            }
           
            $('#slider a').eq(index + 1).fadeIn(function() {
                index++;
                bannerRotator();
            });
        });
    }
    bannerRotator();

});
</script>

Code (markup):

 

I am looking for something I can change in one file as I have well over 100 pages on my website and do not want to go through each individual page making changes.

 

This is why you have a CMS of sorts to parse the content - hence you make a change in ONE file (well, perhaps two, if you want to separate the script and the list of images/banners) and just include that file in the header. You should never need to touch other pages (why is there pages at all? Database-driven, it should be).

 

So you've definitely lost me a little bit here lol. I am very new to html coding and have only been briefly involved with Javascript. So I can use what qwikad posted??? How would I go about that???

 

You can use what I suggested or even your own script (provided it's fixed and working) but you need to do it via include files. It's laughable that you have 100 pages and EACH ONE OF THEM needs to be updated manually. Nobody does that.

 

I'm finding so much sarcasm on these forums yet no one wants to provide me with the proper information. You fail to forgot you were in the learning curve at one point too and you had to ask questions to learn.

 

The point is this: BEFORE you start doing something, you read up, you get an understanding of what you have to do. If you're gonna change the brakes (discs) on your car, you will probably read a service manual first, unless you have a bit of knowledge already. It should be the same with webdevelopment - you try to get an understanding of what tools you have, and what you can do to simplify the process.

And yes - noone does pages manually nowadays - it's way too much to update and change if you need to change one item repeated across all pages - also, there is a LOT of duplicated code across those files. If you use a proper CMS, or even a self-built one, you would have a few files, like an index.php processing all the content, pulling the information from the database, and perhaps a few other files being included depending on what you want on the page - for instance contact forms and similar might need a separately coded file, but it will still be included, and not contain the surrounding code - it just contains the specific code needed for the functionality to work.

Since we have no clue how your site is set up, it's hard to give specific information, but you should definitely look into some sort of management system for your site. It will save you a lot of trouble, and you'll have a lot less trouble doing site-wide updates.

 

Sadly, 99% of the people who want websites now cry "Wah, wah, I don't wanna learn" -- they're simply unwilling to learn what it takes to do even the simplest of things properly... and then have the unmitigated gall to defend their ignorance.

But to be fair, why should web development be any different from the rest of society with people who know jack about **** talking out their asses on topics like medicine, physics, chemistry, biology, and morality.

... and even if they do, they use what Dan Schulz used to call a "poor man's CMS" where you at LEAST have PHP or some other server-side language gluing together the parts that are re-used across pages so you only have to edit things like menus or headings in one place.

It really sounds like the OP just wants to copypasta code instead of learning how any of it works, and that's going to hobble their efforts at doing anything; which given the train wrecks of code they posted.... yeah.