Load hidden image to HTML

Question

I do some actions with couple of images, but to work everything smoothly I need the browser to load the images. For example if i do $('body').append(''); everything works as it should and there is no delay for loading the image.

If I try style="display:none;" on the image it does not load by browser and still there is a delay when executing the script.

Can you offer me any other solution? Thanks

Solution: $('<img/>')[0].src = mouseOverImg; from the Preloading images with jQuery

try opacity instead of display? – IvanL Jun 20 '13 at 08:43 — IvanL, Jun 20 '13 at 08:43
Related: http://jakearchibald.github.io/request-quest/ – Prasanth Jun 20 '13 at 08:45 — Prasanth, Jun 20 '13 at 08:45

score 2 · Answer 1 · answered Jun 20 '13 at 08:46

2

try using visibility: hidden; instead of display:block; while display:none; there is no request and no space on your div for that specify image. it will only load when display: inline; or display:block;

hope it helps

answered Jun 20 '13 at 08:46

bboy

1,357
2
15
31

score 0 · Answer 2 · answered Jun 20 '13 at 08:43

0

Try declaring with $(document).ready(function(){ ** Your code at this place ** });

answered Jun 20 '13 at 08:43

Nitesh

15,425
4
48
60

score 0 · Answer 3 · answered Jun 20 '13 at 08:43

0

You may try to set its position to the off-screen.

What mean that it is is not visible for current user viewport but it was created in html.

answered Jun 20 '13 at 08:43

simpletron

739
4
14

Load hidden image to HTML

3 Answers3