change image on button click

[ranosb]

I have a button that when clicked opens a window with a new link.
I would like a image above the button.

I would like to include a function like ChangeImage() with the buttons onclick event to change the image to another(when the button is clicked)

Whats the best script for this; There are many more buttons on the page and repeated openlink function calls.

function ChangeImage() {
Change current image to this image
}

function openlink1() {
var open1 ='http://yahoo.com'
window.open(open1,'','scrollbars=yes,height=540,width=785,resizable=yes');
}


<input type=button value="Yahoo"
onclick="javascript:location.href='javascript:openlink1()'"
javascript:ChangeImage()">

[rangana]

When you do this:

Code: Select all

<input type=button value="Yahoo"
onclick="javascript:location.href='javascript:openlink1()'"
javascript:ChangeImage()">


...It will redirect your page to yahoo, then you'll no longer see the image,,,how about calling openlink1() function,,,and not using the location.href JS property

Something like this might help

Code: Select all

<input type=button value="Yahoo"
onclick="changeImage();openlink1();" />


...Or you might find it useful, to use the window.open JS method on the changeImage function, anyways, get back if you're stumped

See if it helps

[ranosb]

rangana,

Thanks for replys,

Your right, I didnt need the href; but for some reason it still opened a new window, but I removed it, wrong coding...

So what code can I use for the ChangeIMage() function that will change my image? Do I need to use document.id?

[rangana]

There's no document.id

...It's document.getElementById('nameofid');

...I suggest you open your page just withthe changeImage() function...just include

Code: Select all

window.open('http://www.devppl.com/forum','rangana','width=500,height=300,scrollbar=0');

...this codes in your function

...Actually, I see a lot of easier way to implement this one, the target attribute....,but that would mean another explanation, as I don't want you to be confused much more

...Could you wrap in all your codes here...We'll see how we can be of help

[ranosb]

The windows open fine as is,
I just need a changeimage() function,

I have like 10 openlink functions, each opens different windows, so I need the function to be separate

[rangana]

Alright....do you have the codes on your changeImage() function already?...

....And also,,,this has been leading to many branches..what was your problem BTW?

[ranosb]

Yes thanks, using;

function ChangeImage(buttonclick) {
document.images["img" + buttonclick].src="checkbox.png"
}

[rangana]

Okay, got it now

Why not just use a openlink1 function..and change your image within the function, since you said their will be 10 functions, for 10 buttons

Code: Select all

function openlink1()
{
document.getElementById('imageid').src= 'checkbox.png';
var open1 ='http://yahoo.com'
window.open(open1,'','scrollbars=yes,height=540,width=785,resizable=yes');
}


...Just give your images an id...

...If nothing works, could you please up all your codes..we'll try to figure this out for you

[ranosb]

Your right, that is better, keep all in the same onclick event, I will use this.
Thanks!

[rangana]

Told you.....simplicity is always the best

You're welcome