...

View Full Version : Resolved Script works but JavaScript null error - Help!



87dave87
12-31-2010, 05:38 PM
Hello,

I hope you can help me, I have used a really simple image script which features 3 thumbnails, you click one thumbnail and it loads the image as a larger image.

Works perfectly in Google Chrome, Firefox - and then I've come to try in IE8... works perfect BUT javascript error as follows: -

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; GTB6.6; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; MDDC; InfoPath.2; .NET4.0C)
Timestamp: Fri, 31 Dec 2010 17:14:48 UTC

Message: 'document.images.image0' is null or not an object
Line: 13
Char: 1
Code: 0




Here is the code, what am I doing wrong? I can't spot it, theres a couple of threads online from 2005 about this script but none have helped me clear the error.



<html>
<head>

<script language="JavaScript">
image0 =new Image();
image1 =new Image();
image2 =new Image();

image0.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg"
image1.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg"
image2.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg"

document.images['image0'].src=image0.src;
document.images['image1'].src=image1.src;
document.images['image2'].src=image2.src;

function image_click(clicks)
{
if(clicks==0){document.images['large'].src=image0.src;}
if(clicks==1){document.images['large'].src=image1.src;}
if(clicks==2){document.images['large'].src=image2.src;}
}
</script>

</head>

<body>

<a href="javascript:image_click(0)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" height="93" width="123" alt="" name="image0" border="0"/></a>
<a href="javascript:image_click(1)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" width="123" alt="" name="image1" border="0"/></a>
<a href="javascript:image_click(2)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" height="93" width="123" alt="" name="image2" border="0"/></a>
<img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" align="middle" border="0" width="418" height="284" name="large">

</body>
</html>

Logic Ali
12-31-2010, 07:43 PM
You're running inline code prior to the rendering of the elements that it references.
Also avoid using global variables whose names match element names or IDs.

87dave87
12-31-2010, 08:09 PM
Sorry I am new to this, can you explain

Nile
12-31-2010, 08:10 PM
E.g., you should put the script under the images

87dave87
12-31-2010, 08:21 PM
Yes, I tried that with the same result =/

Logic Ali
12-31-2010, 10:07 PM
Yes, I tried that with the same result =/As I said, global variables must not match element names or IDs:
<html>
<head>


</head>

<body>

<a href="javascript:image_click(0)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" height="93" width="123" alt="" name="image0" border="0"/></a>
<a href="javascript:image_click(1)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" width="123" alt="" name="image1" border="0"/></a>
<a href="javascript:image_click(2)"><img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" height="93" width="123" alt="" name="image2" border="0"/></a>
<img src="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg" align="middle" border="0" width="418" height="284" name="large">

<script type='text/javascript'>
_image0 = new Image();
_image1 = new Image();
_image2 = new Image();

_image0.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg"
_image1.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg"
_image2.src ="http://ec.europa.eu/information_society/activities/egovernment/images/project_logos/sample.jpg"

document.images['image0'].src=image0.src;
document.images['image1'].src=image1.src;
document.images['image2'].src=image2.src;

function image_click(clicks)
{
if(clicks==0){document.images['large'].src=_image0.src;}
if(clicks==1){document.images['large'].src=_image1.src;}
if(clicks==2){document.images['large'].src=_image2.src;}
}
</script>


</body>
</html>

87dave87
12-31-2010, 10:18 PM
That's great thank you very much, happy new year :thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum