...

View Full Version : Help with script to change thumbnail images



eplastek
03-19-2009, 06:36 AM
Hey everyone, I used this code that was posted in a previous topic to change the thumbnail image on my page using a drop down menu. It worked great! However I have front and back views of this certain product and I need the script to be able to recognize which view the user has selected so it loads the correct front or back image. To explain a little its a t-shirt which loads to different colors. When Im viewing the back of the t-shirt, and want to change the color, I dont want the front images to load again because I only have the script written for that. I need it to detect that the back image is loaded, and then when a color is selected, to load that color on the back view. Any help and or direction would be appreciated. Thanks! I linked to a sample of what I've done so far.

http://www.crusadeclad.com/tee/menuchange.html




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD><TITLE>JS1</TITLE>
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT">
<!--
Image1 = new Image(120,90)
Image1.src = "teeblue.gif"
Image2 = new Image(120,90)
Image2.src = "teegreen.gif"
Image3 = new Image(120,90)
Image3.src = "teewhite.gif"
Image4 = new Image(120,90)
Image4.src = "teeblack.gif"
function loadCatch(list)
{
var img = list.options[list.selectedIndex].value
document.thumbnail.src = eval(img + ".src")
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<IMG SRC="desk1.gif" NAME="thumbnail" HEIGHT="90" WIDTH="120">
<FORM ACTION="">
<SELECT NAME="catch" onChange="loadCatch(this)">
<OPTION VALUE="Image1" SELECTED>Bands
<OPTION VALUE="Image2">Clips
<OPTION VALUE="Image3">Lamp
<OPTION VALUE="Image4">Else
</SELECT>
</FORM>
</BODY>
</HTML>

eplastek
03-20-2009, 07:53 AM
what is a direction I can take or maybe a snippet of code that does something that is along the same lines? Would it be something like an if and then statement???

TinyScript
03-20-2009, 08:02 AM
what is a direction I can take or maybe a snippet of code that does something that is along the same lines? Would it be something like an if and then statement???

I would just do a boolean.
if(frontfacing==true){show front of the shirt}
if(frontfacing!=true){show back of the shirt}

Old Pedant
03-20-2009, 08:18 AM
I think you are making it too hard.



<script language=javascript>
var fronts = new Array("teeblue.gif","teegreen.gif","teewhite.gif","teeblack.gif");
var backs = new Array("teebackblue.gif","teebackgreen.gif","teebackwhite.gif","teebackblack.gif");

var showing = fronts;

</script>
...
<body>
<form>
<input type=radio name="frontback" onclick="showing=fronts;" checked> Show front
<input type=radio name="frontback" onclick="showing=backs;"> Show back

<select onchange="document.getElementById("shirt").src=showing[this.selectedIndex];">
<option>Blue
<option>Green
<option>White
<option>Black
</select>
<form>

<img id="shirt" src="teeblue.gif"><!-- shows blue front to start with -->
</body>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum