ブラウザのビューポートサイズを取得する方法

Question

訪問者に高画質の画像を表示させたいのですが、ウィンドウ サイズを検出する方法はありますか?

さらに良いのは、JavaScript を使用するブラウザのビューポート サイズでしょうか?ここの緑色のエリアを参照してください:

Answer 1

jQuery ディメンション関数

$(ウィンドウ).width() および $(ウィンドウ).height()

Answer 2

クロスブラウザ @media(width)< /code> および @media(height) value

リーリー

window.innerWidth および window.innerHeight

• GetCSS ビューポート @media(width)< /code> および @media (height) (スクロールバーを含む)
• initial-scale およびスケーリング の変更 により、移動 エラー が発生し、PPK が ビジュアル ビューポート を呼び出す値までスケールダウンされる可能性があります。 @mediavalue
より小さい
• ネイティブの丸めにより、スケーリングにより値が 1 ピクセル縮小する可能性があります
• IE8では未定義-

document.documentElement .clientWidth および .clientHeight

• CSS ビューポートの幅と等しいマイナススクロール バーの幅
• にスクロール バーがない場合は、@media (width) と @media (height) を一致させます。
• 同じ jQuery(window).width() jQuery Call ブラウザビューポート
• 利用可能なクロスブラウザ
• ドキュメント タイプが欠落している場合は不正確です

＃＃＃リソース＃＃＃

---

さまざまな次元でのリアルタイム出力

verge
• クロスブラウザ ビューポート テクノロジの使用
actual
• 任意の単位で正確な寸法を取得するには、matchMedia を使用します