Preloading images.

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Preloading images.

Post by JellyFish »

I wrote this little jQuery plugin:

Code: Select all

jQuery.extend({
	preload: {
		images: function (imgURLs, callbacks) 
		{
			var i = 0;
			dummyImg = new Image();
			dummyImg.src = imgURLs[i];
			
			dummyImg.onLoad = function () {
				alert('load executed');
				(callbacks.onProgress) ? callbacks.onProgress(++i): "";
				
				if (i != imgURLs.length)
				{
					this.src = imgURLs[i];
				}
				else
				{
					(callbacks.onComplete) ? callbacks.onComplete(): "";
				}
			}
		}
	} 
});
But the problem I have when I execute it passing in an array of images the dummyImg.onLoad handle doesn't execute.

I look at MDN and I couldn't find a Image() constructor function. Where's the Image objects and is there an onLoad handle?

Thanks for reading, I'd so much appreciate any help.
User avatar
infolock
DevNet Resident
Posts: 1708
Joined: Wed Sep 25, 2002 7:47 pm

Post by infolock »

have you looked at mootools ?

They have a really nice image preloader app. If you still want to use JQuery, I'd try asking on their message boards if you need a quicker response.
User avatar
JellyFish
DevNet Resident
Posts: 1361
Joined: Tue Feb 14, 2006 7:18 pm
Location: San Diego, CA

Post by JellyFish »

infolock wrote:have you looked at mootools ?

They have a really nice image preloader app. If you still want to use JQuery, I'd try asking on their message boards if you need a quicker response.
Yes. In fact this plug-in is based on that mootools feature. I figured out the problem.

It was only obvious that I was setting the onLoad property to a function when it was the onload property that I was looking for.
Post Reply