[解決済み] ブラウザのビューポート寸法を取得する方法を教えてください。

質問

訪問者に高画質で画像を提供したいのですが、ウィンドウサイズを検出する方法はありますか？

あるいは、JavaScriptでブラウザのビューポートサイズを表示するのが良いでしょうか？こちらの緑色の部分をご覧ください。

解決方法は？

クロスブラウザ @media (width) と @media (height) 価値観 

const vw = Math.max(document.documentElement.clientWidth || 0, window.innerWidth || 0)
const vh = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0)

window.innerWidth と window.innerHeight

• 取得 CSSビューポート @media (width) と @media (height) スクロールバーを含む
• initial-scale とズーム バリエーション は、モバイルの値を 誤って は、PPKが呼ぶところの ビジュアルビューポート よりも小さく、かつ @media 値
• ズームすると、ネイティブの丸め方によって値が1pxずれることがあります。
• undefined IE8で

document.documentElement.clientWidth と .clientHeight

• イコールCSSビューポート幅 マイナス スクロールバーの幅
• マッチ @media (width) と @media (height) がある場合 いいえ スクロールバー
• と同じ jQuery(window).width() どの jQuery コール ブラウザのビューポート
• 利用可能なクロスブラウザー
• doctype が欠落している場合、不正確

リソース

• 各種寸法のライブ出力
• エッジ クロスブラウザ・ビューポート技術を使用
• 実際 用途 matchMedia 正確な寸法を任意の単位で取得する