1

サイトの場合、ユーザーの画面解像度に応じて背景画像を動的に表示できる必要があります。

つまり、ページの読み込みが開始されると<head>、小さなjavascriptの読み込み内で、cssを介してページの背景が次のようhttp://example.com/backgrounds/beach_800x600に設定されます。800と600はjavascriptを介して決定された画面解像度です。

私は、最も一般的な画面解像度用にさまざまなサイズ変更された画像を作成しているので、ほとんどの人にとって、画面解像度が既存の画像と完全に一致します。完全に一致するものがない場合、たとえば、AxB既存の画像がない画面解像度をユーザーが持っている場合、画像はAxBその場で作成およびサイズ変更され、提供されます。それ以降、解像度を持っている人なら誰でもAxBその画像が提供されます。

私が持っている質問は次のとおりです。

1)これは安全な方法ですか?つまり、カスタム画面解像度用に50を超えるカスタムサイズの画像を作成したくありません。この方法でそのボールパークに滞在することはできますか?また、この方法で知っておくべき他のセキュリティリスクはありますか?

2)たとえば50または100ピクセルの許容誤差を指定する必要があるため、誰かの解像度が700x900で、それがないのに600x800または800x1000がある場合は、新しい画像を作成するのではなく、既存の画像を提供します。もの?もしそうなら、マージンを100ピクセルに設定する必要がありますか、それとももっと良い数値がありますか?

4

2 に答える 2

1

画面解像度ごとに画像を作成することはおそらく望ましくなく、画面解像度ではなく、ブラウザのウィンドウサイズに基づいて画像を作成することをお勧めします。ウィンドウは事実上任意のサイズである可能性があることを考えると、これを再考することをお勧めします。

また、これはJavaScriptではなくCSS3メディアセレクターを使用して簡単に実行できます(JavaScriptを使用して実行することもできます)。

メディアクエリに関する情報については、こちらをご覧くださいhttp://webdesignerwall.com/tutorials/css3-media-queries

于 2012-08-31T17:37:07.500 に答える
1

CSS3メディアクエリとbackground-sizeプロパティを使用することにより、古いブラウザとの互換性を目的とする場合を除いて、JSは実質的に必要ありません。

に関する詳細へのリンクbackground-sizeは次のとおりです。このプロパティを使用すると、ユーザーの解像度に関係なく、さまざまな方法で画像を拡大縮小できます。これは理想的ではない場合があります。

そして、CSS3メディアクエリがあります。これらを使用すると、特定の解像度(または特定の解像度よりも大きいまたは小さい)をターゲットにして、それに応じて表示する画像(または表示方法の有無にかかわらずbackground-size)をブラウザーに指示できます。

于 2012-08-31T17:38:21.900 に答える