#1
  1. No Profile Picture
    Loretta
    Guest
    Devshed Newbie (0 - 499 posts)
    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. #2
  3. No Profile Picture
    Rory
    Guest
    Devshed Newbie (0 - 499 posts)
    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).]
  4. #3
  5. No Profile Picture
    Loretta
    Guest
    Devshed Newbie (0 - 499 posts)
    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
  6. #4
  7. No Profile Picture
    dahamsta
    Guest
    Devshed Newbie (0 - 499 posts)
    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
  8. #5
  9. No Profile Picture
    JustDave
    Guest
    Devshed Newbie (0 - 499 posts)
    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!
  10. #6
  11. No Profile Picture
    JustDave
    Guest
    Devshed Newbie (0 - 499 posts)
    Please excuse the random Scottish words in my earlier post. =P

    ------------------
    JustDave - Friendly Yet Dangerous Web Development Guy!

Similar Threads

  1. [PAID] Need an easy way to make mass produce animated gifs
    By aimjuncture.com in forum Project Help Wanted
    Replies: 0
    Last Post: January 22nd, 2004, 07:12 PM
  2. animated gifs?????
    By musher5 in forum HTML Programming
    Replies: 2
    Last Post: December 5th, 2003, 04:25 PM
  3. How do you use animated GIFs in a form
    By Hitchhiker in forum Visual Basic Programming
    Replies: 3
    Last Post: July 21st, 2003, 03:04 PM
  4. animated gifs on background animating?
    By balance in forum HTML Programming
    Replies: 8
    Last Post: June 2nd, 2003, 09:47 PM
  5. imagecreatefromgif() and animated gifs
    By danjel in forum PHP Development
    Replies: 0
    Last Post: October 2nd, 2002, 05:48 AM

IMN logo majestic logo threadwatch logo seochat tools logo