Preserved Topic: EXTREME preloading of images. (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=18548" title="Pages that link to Preserved Topic: EXTREME preloading of images. (Page 1 of 1)" rel="nofollow" >Preserved Topic: EXTREME preloading of images. <span class="small">(Page 1 of 1)</span>\$

hellwood Nervous Wreck (II) Inmate From: Montreal, Canada Insane since: Jul 2001	posted 09-30-2002 01:45 I have a BIG problem on my page when preloading my big pictures (250x250 pixels) in memory. First, I'm not sure where to put the preloading code (directly in the head, or in a function called by the ONLOAD event) This is in my <HEAD> (my function loadImages() is called by ONLOAD event): ---------------------------------------- sPathArr = new Array(); PicturesArr = new Array(); function loadImages(){ var iCount =0; var countDown; sPathArr[1] = "photos/portrait/IMG_0501_250.jpg"; sPathArr[2] = "photos/portrait/IMG_0687_250.jpg"; sPathArr[3] = "photos/portrait/IMG_0757_250.jpg"; ... many lines... sPathArr[36] = "photos/art/IMG_1190_250.jpg"; for (var i = 1; i < 37; i++){ PicturesArr[i] = new Image(); PicturesArr[i].src = sPathArr[i]; } } ------------------------------------------ If You have a 56K modem, see the web page and you will more understand the problem than ones with a fast connection. http://www.stephanelorrain.com/photo/index.htm As you can see, you cannot click an samall image until all the big ones are loaded in memory. Is there a DHTML way to tell the browser the priority is to load the clicked image before continuing the preloading ???? Pleasy don't be afraid to take a look the HTML code of my page and tell me what wrong!!!! HELP!!!!! PLEASE!!!!
Emperor Maniac (V) Mad Scientist with Finglongers From: Cell 53, East Wing Insane since: Jul 2001	posted 09-30-2002 02:43 hellwood: there is a lot of preloading help (and former questions here: http://faq.ozoneasylum.com/753/ ___________________ Emps FAQs: Emperor
Dracusis Maniac (V) Inmate From: Brisbane, Australia Insane since: Apr 2001	posted 09-30-2002 03:06 How about not preloading any of the large files? The larger image files are only 250px by 250px anyhow so you should be able to compress them to at least 10k without any visible compression artifacts. Then you could just specify the images to load when it is requested. Dig?
hellwood Nervous Wreck (II) Inmate From: Montreal, Canada Insane since: Jul 2001	posted 09-30-2002 06:28 How do I specify the images to load when it is requested? How do I know that a preloaded images is ready?
mr.maX Maniac (V) Mad Scientist From: Belgrade, Serbia Insane since: Sep 2000	posted 09-30-2002 09:07 Simply specify new image object, like this: myImage = new Image(); myImage.src = "image.png"; And then use timer to determinate when "myImage.complete" property becomes true, and that's when image has been completely loaded. After that you can assing its source to any <IMG> element that you have on your page...
Bugimus Maniac (V) Mad Scientist From: New California Insane since: Mar 2000	posted 09-30-2002 10:09 mr.maX, "assing" ??? Have you been staring at those pictures on your web site too long again? . . : slicePuzzle
mr.maX Maniac (V) Mad Scientist From: Belgrade, Serbia Insane since: Sep 2000	posted 09-30-2002 10:11 Bah, I meant to type "assign", heh...

Preserved Topic: EXTREME preloading of images. (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=18548" title="Pages that link to Preserved Topic: EXTREME preloading of images. (Page 1 of 1)" rel="nofollow" >Preserved Topic: EXTREME preloading of images. <span class="small">(Page 1 of 1)</span>\$

hellwood
Nervous Wreck (II) Inmate

From: Montreal, Canada
Insane since: Jul 2001

posted 09-30-2002 01:45

I have a BIG problem on my page when preloading my big pictures (250x250 pixels) in memory.
First, I'm not sure where to put the preloading code (directly in the head, or in a function called by the ONLOAD event)

This is in my <HEAD> (my function loadImages() is called by ONLOAD event):
----------------------------------------
sPathArr = new Array();
PicturesArr = new Array();
function loadImages(){
var iCount =0;
var countDown;
sPathArr[1] = "photos/portrait/IMG_0501_250.jpg";
sPathArr[2] = "photos/portrait/IMG_0687_250.jpg";
sPathArr[3] = "photos/portrait/IMG_0757_250.jpg";
... many lines...
sPathArr[36] = "photos/art/IMG_1190_250.jpg";

for (var i = 1; i < 37; i++){
PicturesArr[i] = new Image();
PicturesArr[i].src = sPathArr[i];
}
}
------------------------------------------
If You have a 56K modem, see the web page and you will more understand the problem than ones with a fast connection. http://www.stephanelorrain.com/photo/index.htm
As you can see, you cannot click an samall image until all the big ones are loaded in memory.

Is there a DHTML way to tell the browser the priority is to load the clicked image before continuing the preloading ????

Pleasy don't be afraid to take a look the HTML code of my page and tell me what wrong!!!! HELP!!!!! PLEASE!!!!

Emperor
Maniac (V) Mad Scientist with Finglongers

From: Cell 53, East Wing
Insane since: Jul 2001

posted 09-30-2002 02:43

hellwood: there is a lot of preloading help (and former questions here:
http://faq.ozoneasylum.com/753/

___________________
Emps

FAQs: Emperor

Dracusis
Maniac (V) Inmate

From: Brisbane, Australia
Insane since: Apr 2001

posted 09-30-2002 03:06

How about not preloading any of the large files?

The larger image files are only 250px by 250px anyhow so you should be able to compress them to at least 10k without any visible compression artifacts. Then you could just specify the images to load when it is requested.

Dig?

hellwood
Nervous Wreck (II) Inmate

From: Montreal, Canada
Insane since: Jul 2001

posted 09-30-2002 06:28

How do I specify the images to load when it is requested?
How do I know that a preloaded images is ready?

mr.maX
Maniac (V) Mad Scientist

From: Belgrade, Serbia
Insane since: Sep 2000

posted 09-30-2002 09:07

Simply specify new image object, like this:

myImage = new Image();
myImage.src = "image.png";

And then use timer to determinate when "myImage.complete" property becomes true, and that's when image has been completely loaded. After that you can assing its source to any <IMG> element that you have on your page...

Bugimus
Maniac (V) Mad Scientist

From: New California
Insane since: Mar 2000

posted 09-30-2002 10:09

mr.maX, "assing" ??? Have you been staring at those pictures on your web site too long again?

. . : slicePuzzle

mr.maX
Maniac (V) Mad Scientist

From: Belgrade, Serbia
Insane since: Sep 2000

posted 09-30-2002 10:11

Bah, I meant to type "assign", heh...