PDA

View Full Version : Quick Question: Syntax?

koinu
04-04-2005, 07:15 AM
I am extremely new to JS, and was attempting to code the following small piece of code. The page loads, but reports no errors, so I'm wondering why it won't work. All it should do is swap the images. I have the image swap function written like it is because I want to support more than two images once I get this working. Anyone have any ideas?


<html>
<head><title>JS image test</title>
</head>
<body>
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT">
<!--
function preload(imgname, imgfile){
if (document.images){
eval(imgname+' = new image()')
eval(imgname+'.src = "+imgfile+"')
}
}
preload(backgroundimage, "images/inventory/0_avi.gif")
preload(skinimage1, "images/inventory/2_avi.gif")
preload(skinimage2, "images/inventory/3_avi.gif")
function nextimage(layername, imagename, newimage){
if (document.images){
if (document.layers && layer != null)
eval('document.'+layername+'.document.images['"+imagename+"'].src = '+newimagename+'.src')
else document.images[imagename] = eval(newimagename+'.src')
}
}
//-->
</SCRIPT>

<a href="javascript:void(null)" onclick="nextimage('skinlayer', 'skin_image', 'skinimage2')"><img src="images/inventory/next.gif"></a>

<div id="skinlayer"><img name="skin_image" src="images/inventory/2_avi.gif"></div>
</body>
</html>
glenngv
04-04-2005, 07:39 AM
Don't use eval. It is not only inefficient but is also confusing to use especially the mixing of single and double quotes.
function preload(imgname, imgfile){
if (document.images){
window[imgname] = new image();
window[imgname].src = imgfile;
}
}

And this is how to reference a layer in NS4 without using eval:

document.layers[layername]

although in this case, you don't need it as accesing an image in NS4 is the same with other browsers, that is, using document.images[imagename].

There are also better ways of preloading images without using many global variables by using a single array. Search this forum for preload scripts.

Also, see my sig for more info of square bracket notation. It will help you a lot and avoid the evil eval method. :D
koinu
04-04-2005, 07:56 AM
Okay, I modified the code to fix a few things, and now I am getting a single error in IE, and no errors in NS/FF (but the script does nothing in either browser). The error complains about the else document.images[imagename].src = newimage.src not being able to find skin2, although it was preloaded. skin2 would be "newimage" in this case.


<html>
<head><title>JS image test</title>
</head>
<body>
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT">
<!--
function preload(imgname, imgfile){
if (document.images){
window[imgname] = new image();
window[imgname].src = imgfile;
}
}
preload('skin2', "images/inventory/3_avi.gif");
function nextimage(layername, imagename, newimage){
if (document.images){
if (document.layers && layer != null)
document.[layername].document.images[imagename].src = newimage.src);
else document.images[imagename].src = newimage.src;
}
}
//-->
</SCRIPT>

<a href="javascript:void(null)" onclick="nextimage(skinlayer, skin_image, skin2);"><img src="images/inventory/next.gif"></a>

<div id="skinlayer"><img name="skin_image" src="images/inventory/2_avi.gif"></div>
</body>
</html>
koinu
04-04-2005, 07:57 AM
double post
glenngv
04-04-2005, 11:28 AM
window[newimage].src;

Did you read the square bracket notation link?