|
|||||||||
|
|||||||||
| |||||||||
|
|||||||||
|
|||||||||
| |||||||||
|
|
|
| |||||||||
 |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
Dev Shed Forums Sponsor:
|
|
#1
June 20th, 1999, 07:52 PM
|
|||
|
|||
|
Hi,
How do you preload an animated gif file completely before the animation begins? Without preloading in some manner, the smooth transition from one frame of the animated gif to the next will be at the mercy of the modem connection. Can someone help me? Regards, Loretta
|
|
#2
June 24th, 1999, 07:52 AM
|
|||
|
|||
|
See Preloading Images Using JavaScript (and scroll down), which seems to be a very clear and simple explanation. I think I would use the method of making a function and using the body onload technique -
www.netscapeworld.com/netscapeworld/nw-08-1997/nw-08-html.html (and of course, in your code, remember to put in the closing </script> tag, which, in his example, would be on the next line after // --> ) - Rory www.stormloader.com/monarkh/resources.html [This message has been edited by Rory (edited 06-24-99).]
|
|
#3
June 24th, 1999, 07:48 PM
|
|||
|
|||
|
Thanks Rory!
I had a quick look at the page you had referenced; however, I am not sure whether it'll help my cause. I already use the Image object feature of Javascript to preload images for applications such as mouse roll-over buttons on a page. However, my situation is now slightly different. My page has only one animated gif file consisting of a number of frames, and the total size of the image is about 80k. The page contains nothing else, no text at all; just this image. Now the speed at which the image loads up (depending on the modem and the state of connection) is at times slower than the set transition time between the individual frames in the animated gif file. As a result, the animation does not always flow as smoothly as it is supposed to (unless the gif file already resides in the cache). What I need is for the gif file to preload completely before anything appears on the page, so when the animation begins, it will always run at the speed it is meant to. Can you still help me out? Regards, Loretta
|
|
#4
June 25th, 1999, 04:28 AM
|
|||
|
|||
|
Loretta (love that name!)
Is this a splash page, or more importantly, will users see any pages before this one? If they do, you could preload the gif in a previous page. That's pretty obvious though, I suppose you've thought about that. Another way of doing it is to add a couple of "loading" frames at the beginning of the animation, which will delay the user while you load the rest of it. Set the delay rate fairly long on them and you could start displaying the rest of the gif when about half of it is loaded. There are other ways too, with JavaScript, but I'm not sure off the top of my head. I'll have a look around for you... adam
|
|
#5
July 13th, 1999, 05:07 AM
|
|||
|
|||
|
This info may come a little late, but anyway...
My recommendation would be to preload the animated GIF in the <HEAD> of the page using JavaScript, as usual, using a single-pixel transparent gif to replace said animated gif in the body of the page by stretching it (using the width and height attributes of the IMG tag). Then, use the onLoad event handler of the <BODY> tag to switch the source for the central image to the file for the animated gif in question. This should only kick in after the page (including the animated gif) have completely loaded, and there you go. The only catch to this is staring at a blank page as the GIF loads, but I don't see any way arounf that, barring a pass thruogh an earlier page, as a previous poster suggested. ------------------ JustDave - Friendly Yet Dangerous Web Development Guy!
|
|
#6
July 13th, 1999, 05:08 AM
|
|||
|
|||
|
Please excuse the random Scottish words in my earlier post. =P
------------------ JustDave - Friendly Yet Dangerous Web Development Guy!
|
|
| Viewing: Dev Shed Forums > Web Design > Web Design Help > Preloading animated gifs |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
 |
|
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
