CSSだけで画像をプリロードするテクニック:phpspot開発日誌

Specere Blogs Blog Archive A Simple CSS Image preloading technique So you need to pre-load images, but don’t want to deal with javascript or complicated workarounds. What do you do? The solution is simple. All we need to do is designate a CSS style with multiple background-images. As your browser reads the style, it will load each image you designate in succession, thus pre-loading your images. Be

[minetty99]

“<div id="preloadedImages">< /div>”

[d_animal141]

CSSだけで画像をプリロードするテクニック

[dekirukana_hate]

プリロード

[kurobuchi]

メニューのロールオーバー時の画像の読み込みとかにいいかも。

[webmarksjp]

markup

[hisasann]

プリロード…

[troussier_d]

できねい

[hiroomi]

CSSに定義

[hamasta]

ふむふむ

[uemu]

へぇ　おもしろいｎ

[bright-f]

おおう！

[closer]

だめげ。

[kusigahama]

↓さすがはまちちゃん。

[cube1192]

なんかダメらしい

[shozzy]

へぇ、と思ったがコメントによると最後のしか読んでないとか。ふむむ。

[masaki_minami]

JavaScriptを使わずに画像をプリロードする技

[kakkyz81]

ato

[Hamachiya2]

ApacheのログみながらIEとFirefoxで確かめてみたよ。なんか、どちらのブラウザでも最後のいっこしかリクエストしてなかった…！

[bigwest]

CSSのみのプリロード

[AmaiSaeta]

驚いた。なるほど、盲点だった。

[picnicgraphic]

JavaScript使用せずCSSのみで画像プリロード。背景画像複数指定が様子見？

[masakiplus]

ちょっとしたこねた。

[ytesaki]

どうやら、つかえないっぽ

[agx]

言われてみれば、ああと思うけど。言われないと気付かない。そんなちょっとしたテクニック。

[ir9]

これは単純ですばらしい…

[Leiu]

考えた事はあるけど、本当に読んでくれてるのかなあ・・

[calm_jp]

divを読み込んだ時点でブラウザが画像を読み込みに行ってキャッシュしてくれる

[kits]

全てのブラウザが複数のbackground-image全部を読むとは限らないのでは。/ 装飾画像のためにHTMLに手を入れるのはどうなのか。/ "/div"の前に空白があるのはなぜだろう。

[rna]

同じセレクタのスタイルに複数 background-images を入れても全部読み込まれる保証は無いのでは? 仕様的には最後の一個だけが有効なので他は読み込まれない可能性があると思う。

[wacky]

JavaScriptを使わずに画像をプリロードする。background-image を列挙しておくだけ。ブラウザ実装に依存するような気もする・・・。