Hey, I can't get all images pre-loaded in frames

[AmyMC]

Hi, I've been buried in this project, which has a lot of pre-loaded
images. The pages which have these images are frames.... and even with
my best attempts to preload them all still most do not. Some use more
than one image and the flicker is obvious.

Below is how I am loading them, and it doesn't matter if I use URL
referenced images or locally, (i.e. ./image1.gif)

<script>
pic1= new Image;
pic1.src="./image1.gif";
pic2= new Image;
pic2.src="http://www....";
</script>

Is there a reliable way to pre-load all images in frames, or *should*
this work and it's something else?

Sincerely, AmyMC

 

[VK]

Hi, I've been buried in this project, which has a lot of pre-loaded

images.

Below is how I am loading them, and it doesn't matter if I use URL
referenced images or locally, (i.e. ./image1.gif)

Not "locally" but "using relative path" as opposed to "using absolute
path" ;-)

pic1= new Image;
pic1.src="./image1.gif";
pic2= new Image;
pic2.src="http://www....";
</script>

imageObject.src = url is not some magic way to immediately transfer
image from the server into cache, it only places a request for caching.
If your frameset contains really a lot of images then they can be
simply not cached all yet by the moment you start mousing around.

Is there a reliable way to pre-load all images in frames, or *should*
this work and it's something else?

In Netscape 3 (where Image / ImageObject.src was introduced) it was
used to pre-cache images and it worked that way just fine. Since then
the "public expectation" is that it will work as on Netscape 3 and
mostly it is this way. From the other side I do not recall any blood
written commitments from browser producers to cache "virtual" images
(declared in the script but not presented on the page).

 

[ASM]

AmyMC a écrit :

Hi, I've been buried in this project, which has a lot of pre-loaded
images. The pages which have these images are frames.... and even with
my best attempts to preload them all still most do not. Some use more
than one image and the flicker is obvious.

Below is how I am loading them, and it doesn't matter if I use URL
referenced images or locally, (i.e. ./image1.gif)

<script>
pic1= new Image;
pic1.src="./image1.gif";
pic2= new Image;
pic2.src="http://www....";

that doesn't preload images in cache
they are only a kind of short-cuts to find images.

Once they have beendisplayed, this time they are in cache and it is then
possible to call them from the cache using short-cut picN.src

To post-load images :

var imgs = ['/image1.gif','http://www...'];
var n = imgs.length;
var P = new Array;
function postload() {
if(n==imgs.length) displayPicts();
else {
P[n] = new Image();
P[n].onload = postload;
P[n].src = imgs[n];
n++;
}
}
onload = postload;

function displayPicts() {
for(var i=0; i<document.images.length; i++)
if(document.images['img_'+i])
document.images['img_'+i].src = P;
}

</script>

Is there a reliable way to pre-load all images in frames, or *should*
this work and it's something else?

Where is the JS preloading images ?

Say it is in frame A and images to display are in A : OK

Say it's in main page :
from frames you would have to call them with : parent.P[x].src

 

[halbenca]

Nice. Can you use this on a single page to more reliably load images?
How would that work on a single page? Could you please show a working
example?

 

[picklescod]

To post-load images :

var imgs = ['/image1.gif','http://www...'];
var n = imgs.length;
var P = new Array;
function postload() {
if(n==imgs.length) displayPicts();
else {
P[n] = new Image();
P[n].onload = postload;
P[n].src = imgs[n];
n++;
}
}
onload = postload;

function displayPicts() {
for(var i=0; i<document.images.length; i++)
if(document.images['img_'+i])
document.images['img_'+i].src = P;
}

POST LOAD IMAGES? WHAT THE HECK IS THAT?......

 

[ASM]

(e-mail address removed) a écrit :

POST LOAD IMAGES? WHAT THE HECK IS THAT?......

example :
<http://stephane.moriaux.perso.wanadoo.fr/truc/post_load_movy.shtml>

 

[picklescod]

(e-mail address removed) a écrit :

example :
<http://stephane.moriaux.perso.wanadoo.fr/truc/post_load_movy.shtml>

COOL ), can you get this working in IE7.0? The loading 0/20 doesn't
work and the START/STOP button doesn't appear, but can't tell otherwise
if your demo works

 

[ASM]

(e-mail address removed) a écrit :

COOL ), can you get this working in IE7.0?

I'ven't IE at all.
Please could you make it working ?

The loading 0/20 doesn't
work

Except in Safari (fixed) it worked in all my browsers.

and the START/STOP button doesn't appear,

This time I don't more use usual css It'ld have to run.

but can't tell otherwise
if your demo works

See this time

 

[picklescod]

I'ven't IE at all.
Please could you make it working ?

I WILL WORK ON THIS TASK AND POST MY RESULTS

 

[ASM]

(e-mail address removed) a écrit :

I WILL WORK ON THIS TASK AND POST MY RESULTS

I think that now it is OK :
<http://stephane.moriaux.perso.wanadoo.fr/truc/post_load_movy.shtml>
it works with each of my browsers.


var imgs = ['/image1.gif','http://www...'];
var n = 0;
var P = new Array;
function postload() {
if(n==imgs.length) displayPicts();
else {
P[n] = new Image();
P[n].onload = function() { n++; postload(); }
P[n].src = imgs[n];
}
}
onload = postload;

function displayPicts() {
for(var i=0; i<document.images.length; i++)
if(document.images['img_'+i])
document.images['img_'+i].src = P.src;
}

 

[picklescod]

i like this concept, but could you show this working? i put two
google images in there, but unclear if anything is going on. am i
running this correctly to post-load those two?

displayPicts() ?

<script>

var imgs =
['http://www.google.com/intl/en_ALL/i.../www.google.com/images/ribbon_aids_day.gif'];
var n = 0;
var P = new Array;
function postload() {
if(n==imgs.length) displayPicts();
else {
P[n] = new Image();
P[n].onload = function() { n++; postload(); }
P[n].src = imgs[n];
}
}

onload = postload;

function displayPicts() {
for(var i=0; i<document.images.length; i++)
if(document.images['img_'+i])
document.images['img_'+i].src = P.src;

}

displayPicts();

</script>

have great day thxs!