Gunnar Bittersmann: mit CSS das Laden von Bildern verhindern?

Beitrag lesen

SELF-Forum

mit CSS das Laden von Bildern verhindern?

Gunnar Bittersmann Homepage des Autors
+1 Informationen zu den Bewertungsregeln

@@Linuchs

Nun gibt es Seiten, wo das Hintergrundbild stört. Die anderen Werte hätte ich aber gerne. Mit display:none kann ich es ausblenden, aber wie kann ich das Laden verhindern, das könnten unnötige 400 KB sein.

IIRC werden Hintergrundbilder von Nachfahrenelementen ausgeblendeter Elemente nicht geladen.

<div style="display: none; background-image: url(foo)"></div>

⬆︎ Bild wird geladen.

<div style="display: none">
  <div style="background-image: url(foo)"></div>
</div>

⬆︎ Bild wird nicht geladen.

Jake Archibald hatte das mal irgendwo so geschrieben, aber “No source to hand, sorry”

LLAP 🖖

PS: Die Inline-Styles dienen hier zur Verdeutlichung. Nicht nachmachen, Kinder.

--
“There’s no such thing as an ‘average’ user, but there is such a thing as an average developer.” —Vitaly Friedman in Accessibility Matters: Meet Our New Book, “Inclusive Design Patterns”
Selfcode: sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|
Beitrag melden
+1
Informationen zu den Bewertungsregeln