Need Help Immediately. Chance for REP!

Ronspc

Daemon Poster
Messages
688
I am building a website pretty much like this:

http://www.pugetsystems.com/configure.php?app_type=g&sys_type=n

I have the radio buttons and all that crap looks great. But what I need help with is. You see on the link I provided how when you select an option it changes the specific picture of the item. I hope i explained that well enough. I want to add that.

I am using Dreamweaver CS4.

If I didn't explain thoroughly enough ugh Im sorry.
 
pagesource.png


Don't know more than basic html, but I would start by looking in here.
 
In your radio button, you'd have an onclick attribute that'd specify a javascript function. This function would then change the source of an element on the page so it pointed to a different picture.

So say this was one of your radio buttons:
<input type="radio" name="foo" value ="1" onclick="changeImage("image.png")"/>

And this was your image:
<img name="image" src="original.png">

This would be your function that was called to change the image:
<script language="JavaScript">
function changeImage(var) {
document.image.src=var;
}
</script>

Untested code, may not be quite right because my HTML / javascript is very rusty, but that should be the gist of it :)
 
In your radio button, you'd have an onclick attribute that'd specify a javascript function. This function would then change the source of an element on the page so it pointed to a different picture.

So say this was one of your radio buttons:
<input type="radio" name="foo" value ="1" onclick="changeImage("image.png")"/>

And this was your image:
<img name="image" src="original.png">

This would be your function that was called to change the image:
<script language="JavaScript">
function changeImage(var) {
document.image.src=var;
}
</script>

Untested code, may not be quite right because my HTML / javascript is very rusty, but that should be the gist of it :)

You'd need to use document.getElementById, so

<img id="image" src="original.png">

This would be your function that was called to change the image:
<script language="JavaScript">
function changeImage(var) {
document.getElementById('image').src=var;
}
</script>
 
oh dear lord. Im using Dreamweaver CS4 not very good wit HTML. But thanks guys, any other suggestions on makin it easier
 
unfortunately no.
if you want to make a page that has dynamic elements then you'll need to do a little bit of scripting...
 
Back
Top Bottom