/    Sign up×
Community /Pin to ProfileBookmark

how do i preload images before the

pages displayed on screen?
i want to load the images before the page is being displayed,
and not that the user will se ewhite spaces instead of pic until those are loaded
thanks
Peleg

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@gil_davisJun 12.2003 — For some reaon, the browser will not preload an image if it is also listed somewhere in the HTML.

You could fool the browser by using a standard preload script and placing blank 1 pixel images as placeholders in the HTML. Then in an onload script, you could run through your images and replace the src with the appropriate file from the preloaded images.

Personally, I'd rather see the image loading (or the place holder) than not see anything. I get the impression that the page (or my computer) is broken. I also do not like seeing the page go through gyrations caused by inserting an image and having the page reflow around it (it makes me dizzy).

Then there are the 7-14% (sic) that browse without JS. What will they see?

I don't know what you mean when you asked about the white spaces. What the browser shows while it is loading an image is controlled by user preferences.
×

Success!

Help @pelegk1 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...