Change Logo By Click Of Button

[Luke]

Name: Change Logo By Click Of Button
Creator: Luke Mansell (me)

How to use...: (the actual code is below in code tags)

You will see with this part here:

function button1()
{
grab.innerHTML = '<center><img src="image1.png"></center>';
}
function button2()
{
grab.innerHTML = '<center><img src="image2.png"></center>';
}
function button3()
{
grab.innerHTML = '<center><img src="image3.png"></center>';
}
function button4()
{
grab.innerHTML = '<center><img src="image4.png"></center>';
}

That there is 4 functions. To add more, all you have to do is do:

function button5()
{
grab.innerHTML = '<center><img src="image4.png"></center>';
}

Right below the other function. I've bolded 5 because that is what you have to change every-time you add a new function which holds our image. So the next one would look like:

function button6()
{
grab.innerHTML = '<center><img src="image4.png">';
}

And so on..... Next we need to know where to add the image. So using our previous bit of the functions you edit the underlined bit to your image URL (YOU MUST ADD HTTP://WWW. !):

function button1()
{
grab.innerHTML = '<center><img src="image1.png"></center>';
}
function button2()
{
grab.innerHTML = '<center><img src="image2.png"></center>';
}
function button3()
{
grab.innerHTML = '<center><img src="image3.png"></center>';
}
function button4()
{
grab.innerHTML = '<center><img src="image4.png"></center>';
}

Next if you have added more functions we need to edit the buttons which show the button to make the banner change. We are talking about this part:

<input type="button" value="Image1" onclick="button1()" />
<input type="button" value="Image2" onclick="button2()" />
<input type="button" value="Image3" onclick="button3()" />
<input type="button" value="Image4" onclick="button4()" />

You change the italics to the text you want to appear on the button, it might be a good idea to add a short description of what clicking the button will do (; The underlined is our functions bit, the name of that is the name of the function that button will be using. YOU DON'T NEED TO EDIT THESE! But if you want to add more we can go....:

<input type="button" value="Image5" onclick="button5()" />

And would need to add:

function button5()
{
grab.innerHTML = '<center><img src="image5.png"></center>';

Too. For every function you add you need to make a button.... Now that's pretty much it... Remember to add functions for every button vice versa ;D

Code:

<script type = "text/javascript">
<!--
/*
Change Logo By Click Of Button
Made By Luke Mansell
[url]codercommunity.proboards.com[/url]
Please don't rip or claim as your own or post on your forum's code index!! Do not remove this header!
*/

// This first bit you don't need to edit, so keep it untouched!

var grab = document.getElementsByTagName("td")[1];

function button1()
{
grab.innerHTML = '<center><img src="image1.png"></center>';
}
function button2()
{
grab.innerHTML = '<center><img src="image2.png"></center>';
}
function button3()
{
grab.innerHTML = '<center><img src="image3.png"></center>';
}
function button4()
{
grab.innerHTML = '<center><img src="image4.png"></center>';
}
//-->
</script>

<input type="button" value="Image1" onclick="button1()" />
<input type="button" value="Image2" onclick="button2()" />
<input type="button" value="Image3" onclick="button3()" />
<input type="button" value="Image4" onclick="button4()" />


Copyright: Do not remove the header, rip, steel, claim as your own etc (; Made By Luke Mansell ©