1

ブラウザーのサイズに基づいて、読み込む適切な画像が JavaScript によって決定されるページを作成しようとしています。例えば:

<img src="image1.jpg" />

JavaScriptはそれを次のように変更します:

<img src="image1_800px.jpg" />

800px 幅の画像バージョンをロードします。

これを行うことは問題ではありません。JavaScript を使用しないブラウザで同じことをしようとすると、問題が発生します。基本的な考え方は、最初は画像を非表示にして、NOSCRIPT タグのスタイルで表示することです。そのため、JavaScript をサポートするブラウザーは画像の URL を変更してそれらの画像を表示し、JavaScript をサポートしないブラウザーは css によってそれらの画像を再表示します。問題は、display:none の画像がブラウザによって読み込まれることです。また、画像のURLをsrc属性以外に追加することはオプションではありません。そのような画像はjavascriptに依存してsrcを設定するからです。

これを機能させることが可能であれば、何かアイデアはありますか?

例: domready で画像の src 属性を書き換えて、ブラウザが古い src から画像の読み込みを開始しないことを期待できますが、そうでしょうか? もしそうなら - それは常にそうですか、それとも一部のブラウザは異なって動作しますか?

4

1 に答える 1

2

あなたが探しているのはhttp://adaptive-images.com/だと思います-Javascriptを使用して画像サイズを決定しますが、ユーザーがJavascriptを有効にしていない場合は、サイズ変更された画像を提供するバックアップオプションもあります(注意して、ドキュメントを読んでください)。

于 2012-11-22T11:51:02.620 に答える