homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Browsers / Opera Browser Usage and Support
Forum Library, Charter, Moderator: open

Opera Browser Usage and Support Forum

<div class="hidden"> won't work properly

5+ Year Member

Msg#: 3143859 posted 5:48 pm on Nov 2, 2006 (gmt 0)

I am trying to load images in the cache in background for a photo gallery. I am preloading with javascript the thumbnails and first image in the <HEAD> area. I do not want to do the same with the rest of the images.

So I have this code writen:

<div class="hidden">
<img src="images/dfdfdf.jpg" alt="" />
<img src="images/dfdfdf2.jpg" alt="" />

Well, when using opera and my webpage on my local machine it works fine. When I upload the page the net and try to test it. The images do not appeared to be cached or even loaded. For example. Using the wepage on my local machine, opera says there are 71 items loading. ON the website it only says 46. The 25 images aren't being brought in. When I click on the image I have to wait for it to download (even if I wait a few minutes to make sure it had time to load (I'm using a 2500kbps connection btw)).

Anyreason why this wouldn't work? Firefox and IE work just fine.

[edited by: MingoSplash at 5:52 pm (utc) on Nov. 2, 2006]



WebmasterWorld Administrator bill us a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

Msg#: 3143859 posted 3:56 am on Nov 6, 2006 (gmt 0)

Could it be a cache issue? Are you properly clearing Opera's cache? Are you sure that all of your image paths are correct? Do you or your ISP use a proxy that might be caching these images?


WebmasterWorld Senior Member 10+ Year Member

Msg#: 3143859 posted 4:14 am on Nov 6, 2006 (gmt 0)

I suspect Opera is just being "smart" enough to realize that since the images aren't visible they don't "need" to be downloaded. This is actually a very logical thing when you think about it.


WebmasterWorld Senior Member suzyuk us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 3143859 posted 6:08 am on Nov 6, 2006 (gmt 0)

I read that it is optional for a UA to download images with, or inside any element with, the setting of display: none; - Opera seemingly have taken the option not to.

You can achieve preloading via other CSS methods if you still need to, e.g absolutely position that hidden div "off left" :

.hidden {
position: absolute;
left: -9999px;

or depending on your Gallery application you might be able to position the images where they're supposed to be and use z-index to toggle their display? (you can only use z-index on a relatively or absolutely positioned element)

JAB Creations

WebmasterWorld Senior Member jab_creations us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 3143859 posted 9:02 am on Nov 8, 2006 (gmt 0)

You should use z-index. Content is not supposed to be loaded when inside of any element set to display: none; so you've at least approached it half correctly initially (which is more then I can say for myself most of the time ;)).

div.body {
z-index: 1;
div.hidden {
z-index: 0;

You will have to position your body div of course.

- John

Global Options:
 top home search open messages active posts  

Home / Forums Index / Browsers / Opera Browser Usage and Support
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved