Hi - I'm sure I shouldn't be posting in this forum really as I am far from being advanced enough, but this place has been my saviour on many occasion and since I can't find the info I need in a search I was wondering if any of you highly skilled folks could help me with a query.
I'm using coffeecup to design a website, and it has built in ready-made javasript that can be used. One of these scripts is an image previewer.
I copied and pasted the code as instructed into my webpage, and the result looked like this:
-----
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function CoffeePreview(sel) {
document.CoffeePreview.src = "" + sel.options[sel.selectedIndex].value;
}
function CoffeeShow(sel) {
images = new Array();
images[1] = "Acuity.jpg";
images[2] = "BLBunch.jpg";
images[3] = "3.jpg";
images[4] = "4.jpg";
images[5] = "5.jpg";
images[6] = "6.jpg";
window.location.href = images[sel.selectedIndex+1];
}
// End -->
</script>
</HEAD>
</head>
<body>
<center>
<form name=previewselect>
<select name=selbox size=1 onChange="CoffeePreview(this)">
<option value="TNAcuity.jpg">Acuity
<option value="TNBLbunch,jpg">BLBunch
<option value="3-small.jpg">Image #3
<option value="4-small.jpg">Image #4
<option value="5-small.jpg">Image #5
<option value="6-small.jpg">Image #6
</select>
<p>
<img name="preview" src="1-small.jpg" width=150 height=113 border=1>
<p>
<input type=button value="view Image" onclick="CoffeeShow(this.form.selbox)">
</form>
</center>
</body>
</html>
-----
I've got as far as renaming the first two files on each list to the names of the actual photos and left the rest so you can see what the code was and how I've modified it.
Now - the options on the listbox are as they should be (ie the first two options in the list read "Acuity" and "BLbunch" as one would expect. And clicking the "View Image" button which has been created does indeed produce the correct image.
But the little preview window just shows a little red X.
I'm pretty sure the line that I need to change to get this working is the one that reads
<img name="preview" src="1-small.jpg" width=150 height=113 border=1>
But I don't know what to change it to. If I change it to "TNAcuity.jpg" then it shows a preview of the first picture, but obviously won't change when I change the drop down list.
Can anyone tell me what I should insert instead of this literal file reference in order to show an image according to what the value is in the drop down box?
Hope that makes sense, and thanks in advance for any help anyone can offer.
Matt
I'm using coffeecup to design a website, and it has built in ready-made javasript that can be used. One of these scripts is an image previewer.
I copied and pasted the code as instructed into my webpage, and the result looked like this:
-----
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function CoffeePreview(sel) {
document.CoffeePreview.src = "" + sel.options[sel.selectedIndex].value;
}
function CoffeeShow(sel) {
images = new Array();
images[1] = "Acuity.jpg";
images[2] = "BLBunch.jpg";
images[3] = "3.jpg";
images[4] = "4.jpg";
images[5] = "5.jpg";
images[6] = "6.jpg";
window.location.href = images[sel.selectedIndex+1];
}
// End -->
</script>
</HEAD>
</head>
<body>
<center>
<form name=previewselect>
<select name=selbox size=1 onChange="CoffeePreview(this)">
<option value="TNAcuity.jpg">Acuity
<option value="TNBLbunch,jpg">BLBunch
<option value="3-small.jpg">Image #3
<option value="4-small.jpg">Image #4
<option value="5-small.jpg">Image #5
<option value="6-small.jpg">Image #6
</select>
<p>
<img name="preview" src="1-small.jpg" width=150 height=113 border=1>
<p>
<input type=button value="view Image" onclick="CoffeeShow(this.form.selbox)">
</form>
</center>
</body>
</html>
-----
I've got as far as renaming the first two files on each list to the names of the actual photos and left the rest so you can see what the code was and how I've modified it.
Now - the options on the listbox are as they should be (ie the first two options in the list read "Acuity" and "BLbunch" as one would expect. And clicking the "View Image" button which has been created does indeed produce the correct image.
But the little preview window just shows a little red X.
I'm pretty sure the line that I need to change to get this working is the one that reads
<img name="preview" src="1-small.jpg" width=150 height=113 border=1>
But I don't know what to change it to. If I change it to "TNAcuity.jpg" then it shows a preview of the first picture, but obviously won't change when I change the drop down list.
Can anyone tell me what I should insert instead of this literal file reference in order to show an image according to what the value is in the drop down box?
Hope that makes sense, and thanks in advance for any help anyone can offer.
Matt
As expected, the page loads initially with the file TNAcuity.jpg in the preview pane. I assume this is because I have explicitly named it like this: