Wie man Vorbelastung Bilder nur mit CSS (kein JS)?

Question

Wie kann ich Vorbelastung Bilder nur mit Hilfe von CSS, also ohne JavaScript zu verwenden? Es hat Cross-Browser sein.

Ich will nicht, CSS-Sprites verwenden. Gibt es eine andere Lösung?

Answer 1

Sie können mehrere Elemente verwenden, mit background-position: -1000px -1000px; versteckt und geben ihnen eine background-image für jedes Bild, das Sie vorladen wollen.

• Sie können mehr hier lesen

Answer 2

Verwenden Sie CSS Sprites .

Answer 3

Sie könnten versuchen Laden sie alle vor dem Body-Tag zu beenden und sie nicht angezeigt werden soll. Dann, wenn Sie sie später rufen sie im Cache sein sollten, wenn Sie mit der exakt gleichen Pfad verwenden.

<img src="/i/myimage.jpg" alt="image preload" style="display:none;" />

Sie können auch eine Klasse mit Display machen. None und Anwendung, um alle Bilder, die Sie auch auf Vorspannung wollen

Dies würde entstehen mehr HTTP-Anfragen, obwohl, und wenn Sie auf diejenigen reduzieren wollen schlage ich CSS Sprites Wenn das jemals Bedenken Sie.