PDA

View Full Version : How do I prevent mouseovers from stopping preloading


rogersjr
11-03-2002, 12:01 AM
Hi,

I have a page with 40 dynamic tooltips (script originally published at DHTML Central) Many have images so I tried preloading them by calling the image sized as 1 pixel. Trouble was that no image would load until they were all loaded. Now I have a preload script (below) that loads the images after the page has loaded. It then keeps preloading the images until a mouseover occurs. If an unloaded image is requested the script allows it to load.

Problem is that this or any mouseover stops any further preloading. Naturally I want the preloading to continue while the visitor reads the tooltip windows. Has anyone got any ideas or can point me in the right direction?

My page is at: http://home.vicnet.net.au/~cerberus/timeline.html

<SCRIPT language="javascript">
function preload() {
if (!document.images) return;
var ar = new Array();
var arguments = preload.arguments;
for (var i = 0; i < arguments.length; i++) {
ar[i] = new Image();
ar[i].src = arguments[i];
}
}
</SCRIPT>



<body onLoad="preload('image1.jpg','image2.jpg','image3.gif')">

joh6nn
11-03-2002, 06:54 AM
add the bit in blue, delete the bit in red.

<SCRIPT language="javascript">
function preload() {
if (!document.images) return;
var ar = new Array();
var arguments = preload.arguments;
for (var i = 0; i < arguments.length; i++) {
ar[i] = new Image();
ar[i].src = arguments[i];
}
}
preload('image1.jpg','image2.jpg','image3.gif');
</SCRIPT>



<body onLoad="preload('image1.jpg','image2.jpg','image3.gif')">

rogersjr
11-03-2002, 09:40 AM
Thanks for the suggestion. Unfortunately it increases the time that the page takes to load from 25 seconds to 135 seconds. The other method is great in that it allows the page to load so that it can be seen and then preloads the images in the background. The problem is that any mouseover activity stops any further preloading from occuring. Thanks again for the suggestion.

joh6nn
11-03-2002, 10:01 AM
John, when you say that it stops the preloading, how do you know that it stops it?

i ask, because it's taking 110 seconds for those images to load; almost 2 minutes. though it may seem like it's stopped to you, it could just be, that's taking a long long time.

rogersjr
11-03-2002, 10:17 AM
Sorry. My confusing explanation. The method that you suggested works. In the 110 seconds it loads the page plus all of the images. The problem with that method is that it takes too long.

The body onload method that I was using loads the page in around 25 seconds. It can be seen, read & scrolled. Then the prloading of the images continues while the visitor reads the page. If they activate a popup (even one with a preloaded image) this will stop any further preloading from happening.

Naturally I want the best of both worlds. I want the fast initial load time and then for the background preloading to continue uninterupted.


The page in question is http://home.vicnet.net.au/~cerberus/timeline.html

modified with your suggestion

http://home.vicnet.net.au/~cerberus/timeline2.html


It may well be that the solution is not possible.

joh6nn
11-03-2002, 10:40 AM
john, you've reiterated your point, but you haven't answered my question. you say that they stop loading, but you haven't told me how you know they stop. in order for me to be able to come up with a solution, i need to be able to reproduce the problem. and i haven't been able to do that; in my experiments, the images never stop loading, they just take 2 minutes to load.

so, i need to know what it is that you're doing, that lets you know they've stopped loading.

rogersjr
11-03-2002, 10:57 AM
OK. I thought that you had misunderstood me.

If I load the original page it takes about 2 minutes before every image is available. Easy to tell if they are loaded. Simply mouseover the yellow icon and if the popup contains an image it will either appear instantly or it will slowly load.

To test this I first delete the temporary internet files in my browser. Then I hold down Ctrl and click on refresh to load from the server. After the page loads (25 seconds) I then wait 10, 20 or 30 seconds so that some preloading can occur. I then mouseover one of the icons near the top of the list, eg 1860. The image will appear instantly. Working down the list it is easy to see where the proloading got up to. Now no matter how long you wait no futher preloading will occur. Easy to test, just mouseover an icon further down the list.

joh6nn
11-03-2002, 12:00 PM
well, John, two things:

1) i tested for this, exactly the same way you did, in multiple browsers, and my results showed that the images didn't stop loading. so i don't know what to tell you. as far as i can tell, everything is working fine, and this is just a quirk on your machine.

2) i don't think that your problem has to do with preloading. i think your problem has to do with User Interface. in my opinion, what you've done here, is recreate the wheel. almost all of these tooltips, are the size of a full page. it seems to me that thumbnails and links would work better here. is a tooltip cooler? maybe; but i think you'll agree, it doesn't make as much sense as a thumbnail & link combo, in this context.

good luck to you.

rogersjr
11-03-2002, 07:55 PM
1 - I hope that you are correct and that the problem is on my machine. I will test it on other setups.

2 - I use tooltips because they are quick to load. On this page they are mostly large, but I can't see that this is a problem.

Thanks again for your assistance. I will post my results of trials on other machines and hope that it is just mine.

Simrey
11-03-2002, 08:59 PM
Just a pedantic thought on your code here, John, if I may. Your preload function is

function preload() {
if (!document.images) return;
var ar = new Array();
var arguments = preload.arguments;
for (var i = 0; i < arguments.length; i++) {
ar[i] = new Image();
ar[i].src = arguments[i];
}
}

The line var arguments = preload.arguments is meaningless in this context because js functions automatically generate a local array called arguments. Your subsequent references to the arguments array are valid without that line.

krycek
11-04-2002, 01:37 AM
um, if it's any help, I am getting the problem that rogersjr is describing. I visited the page, and waited a little while, then worked my way down the links. Two had loaded, and the third loaded while I waited. I then waited some more minutes but no more images loaded.

I am not sure why this is happening but at least it is not a random event. I am unable to offer any advice, but my system is running Windows XP Pro with IE6, just so you know :)

::] krycek [::

rogersjr
11-05-2002, 03:01 AM
Simrey,

I have removed the offending code and it works as well as it did. Thanks for the advice.


krycek,

I too had the same result on using two other computers (win ME). This and your experience makes me think that the problem may not be local. The preloading is also stopped on another page when a sort table script loads. http://home.vicnet.net.au/~cerberus/crew.html

Thanks for the feedback