problem with Image Object's onLoad function

jono · #1 (**permalink**) Jan 9th, 2005, 19:27

Hello,

This is my first post on this forum. Any help would be much appreciated. Here is my problem:

I have a web page http://www.freewaymedical.co.uk/productsindex.php, which is basically 5 slideshows that navigate the product range of a client of mine. The slideshows work fine, but I would like to improve the users experience by showing the user a "loading" image while the images for each slideshow are being downloaded from the server.

I have been playing with the onLoad function of the javascript Image object as this seemed to be the way forward. However, my tests with this function have been unsuccessful. Basically, when a large gif file is preloaded, the onLoad function should be called. When I load the page, the onLoad function is called straight away, even though the image has not yet been loaded into memory.

I know this because the gif could not possibly have downloaded in this time and when i include the image in the page, it takes ages to appear.

Here is the page I used to first test the function:

<html>
<head>
<script language="JavaScript">

// create an image object
objImage = new Image();

// preload the image file
objImage.src='http://antwrp.gsfc.nasa.gov/apod/image/0308/abyss_amanda_big.jpg';

// set what happens once the image has loaded
objImage.onLoad=imagesLoaded(objImage);

// function invoked on image load
function imagesLoaded(x)

{
alert(x.src + " has loaded");

}

</script>
</head>

<body>

testing</p>

</body>
</html>

What I get is the alert popping up straight away, when I would expect the image to take at least 5 seconds to download and then the popup message to appear.

Any ideas what I am doing wrong?

Webforumz Staff · #2 (**permalink**) Jan 10th, 2005, 05:11

First off, it has to be .onload not .onLoad

You also can't send a parameter to an event handler.
http://msdn.microsoft.com/workshop/a...nts/onload.asp

You might also look into the .onreadystatechange event
http://msdn.microsoft.com/workshop/a...tatechange.asp

jono · #3 (**permalink**) Jan 10th, 2005, 08:10

Thanks for the reply.

I tried erasing the parameter and changing onLoad to onload but I still got the same unexpected result.

However, I tested the .onreadystatechange event and that seemed to work a treat. I will defo go take this route.

Thanks again!!

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
add image src from javascript function	ktsirig	JavaScript Forum	1	Mar 14th, 2008 11:38
call php function in image url	csun	PHP Forum	16	Aug 19th, 2007 18:49
Problem: onClick Function	mihirc	Web Page Design	16	Jul 28th, 2007 11:20
passing an image to a function? Teaser	ppgpilot	PHP Forum	2	Mar 18th, 2006 00:28
Problem in Setting Cookie on body onload (frame page)	call14	JavaScript Forum	1	Dec 20th, 2005 14:47

		Webforumz.com > Main Forums > Program Your Website > JavaScript Forum
problem with Image Object's onLoad function