teknojunkey
02-26-2009, 03:33 PM
Hi
Im trying to stack images (png, or gif's) on top of each other into individual divs on diferent layers positioned with css, however all i can do is replace them with this script.
Is this possible with js and can i load images onChange into empty div's ?
<SCRIPT>
// preload images
var img1 = new Image().src = "/images/jht.gif"
var img2 = new Image().src = "/images/jsht.gif"
var img3 = new Image().src = "/images/pht.gif"
function setImage(imageSelect) {
theImageIndex = imageSelect.options[imageSelect.selectedIndex].value;
if (document.images)
document.images[0].src = eval("img" + theImageIndex);
}
</SCRIPT>
</HEAD><BODY>
<FORM NAME="theForm" METHOD="POST">
<div>Images:
<SELECT NAME="items" onChange="setImage(this)">
<OPTION VALUE="1">Image 1
<OPTION VALUE="2">Image 2
<OPTION VALUE="3">Image 3
</SELECT>
</div>
<div id="far"><IMG SRC = "/images/base_image.gif" ></div>
</FORM>
</BODY>
An example; an image of a tshirt, and you want to add a print to the tshirt to preview what the final product would look like.
thanks
Im trying to stack images (png, or gif's) on top of each other into individual divs on diferent layers positioned with css, however all i can do is replace them with this script.
Is this possible with js and can i load images onChange into empty div's ?
<SCRIPT>
// preload images
var img1 = new Image().src = "/images/jht.gif"
var img2 = new Image().src = "/images/jsht.gif"
var img3 = new Image().src = "/images/pht.gif"
function setImage(imageSelect) {
theImageIndex = imageSelect.options[imageSelect.selectedIndex].value;
if (document.images)
document.images[0].src = eval("img" + theImageIndex);
}
</SCRIPT>
</HEAD><BODY>
<FORM NAME="theForm" METHOD="POST">
<div>Images:
<SELECT NAME="items" onChange="setImage(this)">
<OPTION VALUE="1">Image 1
<OPTION VALUE="2">Image 2
<OPTION VALUE="3">Image 3
</SELECT>
</div>
<div id="far"><IMG SRC = "/images/base_image.gif" ></div>
</FORM>
</BODY>
An example; an image of a tshirt, and you want to add a print to the tshirt to preview what the final product would look like.
thanks