Opera lädt Bilder nicht wegen CSS-Eigenschaft "display: none"

[tschroeder]

Hallo,

ich habe hier den Effekt, dass der "Opera" - Browser (Version 9.63, Build 10476) beim Aufruf der Seite einige Bilder nicht herunterlädt, weil diese defaultmäßig die CSS-Eigenschaft "display": none" haben. Erst in dem Moment, wo ich per JavaScript den Wert auf "block" setze, werden die Bilder heruntergeladen.

Gibt es eine Möglichkeit, Opera zu "zwingen", die Bilder gleich beim Aufruf der Seite zu laden?

Gruß

Thomas

 

[prm]

Das ist doch wohl auch der Sinn von "display: none": Dass Elemente nicht angezeigt werden:
SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

Ich verstehe dein Problem nicht.

 

[Bernhard]

Hallo,

ich habe hier den Effekt, dass der "Opera" - Browser (Version 9.63, Build 10476) beim Aufruf der Seite einige Bilder nicht herunterlädt, weil diese defaultmäßig die CSS-Eigenschaft "display": none" haben. Erst in dem Moment, wo ich per JavaScript den Wert auf "block" setze, werden die Bilder heruntergeladen.

Gibt es eine Möglichkeit, Opera zu "zwingen", die Bilder gleich beim Aufruf der Seite zu laden?

Gruß

Thomas

Hallo Thomas,

eigentlich sollte kein Browser die Bilder vorausladen, wenn sie display:none; haben.
Aber es gibt verschiedene Möglichkeiten:

• Du kannst sie per JavaScript vorausladen
• Du kannst Sie mit absolute weit außerhalb des viewports positionieren
• wenn Du die Bilder z.B. über Thumbnails aufrufst, kannst Du jedem Thumbnail
  per CSS das entsprechende große Bild als Hintergrundbild geben...

Grüße
Bernhard

 

[Asterixus]

Mach das Bild doch 0*0px groß

 

[Efchen]

Du kannst Sie mit absolute weit außerhalb des viewports positionieren

Ich würd sie gar nicht so weit außerhalb positionieren, nämlich oberhalb der linken oberen Ecke. Wo die untere rechte Ecke ist, ist ja immer anders und die Werte kann man mit CSS nicht berechnen. Oder kann man "left:101%" angeben?

 

[Bernhard]

Ich würd sie gar nicht so weit außerhalb positionieren, nämlich oberhalb der linken oberen Ecke. Wo die untere rechte Ecke ist, ist ja immer anders und die Werte kann man mit CSS nicht berechnen. Oder kann man "left:101%" angeben?

Hallo Efchen,

O.K., sie rechts des Viewports zu platzieren hatte ich überhaupt nicht in Erwägung gezogen...

In den Quelltext schreibe ich Elemente, die ich erst später anzeigen will, da, wo sie hingehören.
Wenn Du jetzt aber einen im Viewport zentrierten Inhaltsbereich hast und der Viewport
sehr groß ist (da haben wir keinen Einfluss!), dann sollte da durchaus Sicherheitsabstand sein.
Die Dateigröße beeinflusst das nur in einem vernachlässigbaren Maß:

.element {
    position:absolute;
    left:-999em;
    visibility:hidden;
}

Am besten gefällt mir aber nach wie vor die Methode, die Bilder als Hintergrundbild vorauszuladen,
da ich das explizit für die Screen-Ausgabe machen kann, anstatt sie für andere Ausgabegeräte
extra verstecken zu müssen...

Grüße
Bernhard