0

I have a full size image and I want the page to show a loading gif until the image is ready to load, then fadein and then run other transitions afterwards as I have fadein div effect too.

So this is what I want to happen: 1 - Loading gif appears 2 - Full page image loads 3 - loading gif fades out 4 - Other jQuery animations run

I can code the individual animations but I don't know how to combine the sequence so they all work together. Any info would be ace?

Joseph Gregory
  • 579
  • 1
  • 7
  • 24
  • 2
    Duplicate or relevant questions [here](http://stackoverflow.com/questions/476679/preloading-images-with-jquery), [here](http://stackoverflow.com/questions/544993/official-way-to-ask-jquery-wait-for-all-images-to-load-before-executing-somethin), [here](http://stackoverflow.com/questions/3862879/preload-an-array-of-images-with-jquery), [here](http://stackoverflow.com/questions/4445843/jquery-preloading-images-for-animation), [here](http://stackoverflow.com/questions/5206145/single-image-jquery-preloader), [here](http://stackoverflow.com/questions/9379855/preload-background-images-with-jquery). – ajp15243 Jun 12 '13 at 22:04
  • Which way would you suggest is the best as these all show different ways and means – Joseph Gregory Jun 12 '13 at 22:07
  • 2
    I think if I were building what you're talking about, I'd load the page and then use Ajax to fetch the image. start the spinner when you make the ajax call, stop it again when the download is complete, then do your fades. – Jerry Jun 12 '13 at 22:08
  • Though [here](http://stackoverflow.com/questions/4285042/can-jquery-ajax-load-image) is a good discussion of how to do it both with and without Ajax. – Jerry Jun 12 '13 at 22:14

0 Answers0