By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
446,213 Members | 1,086 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 446,213 IT Pros & Developers. It's quick & easy.

wait for image to download

P: n/a
Hi,

I have a html which have a <imgtag. Since it takes quite some time to
download the image when user visit the page, I would like to show a
small animation at the same location of the <imgfirst. When the image
is totally downloaded, I would like to discard the animation and
display the image at the same location. How can I do it?

Thanks,

qq

Jul 8 '06 #1
Share this Question
Share on Google+
2 Replies


P: n/a
qu******@yahoo.com said the following on 7/7/2006 10:01 PM:
Hi,

I have a html which have a <imgtag. Since it takes quite some time to
download the image when user visit the page, I would like to show a
small animation at the same location of the <imgfirst. When the image
is totally downloaded, I would like to discard the animation and
display the image at the same location. How can I do it?
Use two images. The animation and the large one. Center the animation on
the large one. Hide the large one using CSS. Use the onload event for
the page to trigger a function that will hide the animation and display
the larger image.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Temporarily at: http://members.aol.com/_ht_a/hikksnotathome/cljfaq/
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Jul 8 '06 #2

P: n/a

Put your <imgin a <span style="background: url(smaller-image.gif);min-width:
100px;min-height: 100px"element, and put your <imgin it, the small one, as the bgimage of
the <spanwill show, as it'd be responded quicker from the server, will show in the
background, until the big image is fully loaded. You could give the bgimage a
background-position, so it shows at the bottom in order to have it there till the bigger image
covers it.

Danny
Jul 8 '06 #3

This discussion thread is closed

Replies have been disabled for this discussion.