JavaScript ディスプレイの幅/高さ/色深度を取得する(screen)

JavaScriptのディスプレイの幅/高さ/色深度を取得するサンプルです。
screenオブジェクトを使用します。

目次

screenオブジェクト

window.screen
screenオブジェクトの主なプロパティ
 プロパティ 説明
 width ディスプレイの幅(ピクセル)
 height ディスプレイの高さ(ピクセル)
 availWidth 利用可能なディスプレイの幅 (ピクセル)
タスクバー等を除いたもの
 availHeight 利用可能なディスプレイの高さ (ピクセル)
タスクバー等を除いたもの
 colorDepth ディスプレイの色深度(1ピクセル当たりのビット数)
24ビットであれば約1677万色(フルカラー)※1

(※1) 赤の8ビットと緑の8ビットと青の8ビットを足した24ビット。
8ビットで256色表現できるので赤:256色 ☓ 緑:256色 ☓ 青:256色 =16,777,216となる。

コード

サンプルのコードです。

<script>

console.log(screen.width); // ディスプレイの幅

console.log(screen.height); // ディスプレイの高さ

console.log(screen.availWidth); // 利用可能なディスプレイの幅

console.log(screen.availHeight); // 利用可能なディスプレイの高さ

console.log(screen.colorDepth); // ディスプレイの色深度

</script>

関連の記事

ブラウザのウィンドウサイズと色深度を表示するツールするWebツール

プログラムでつまったらteratailに登録して質問しましょう!↓↓↓

△上に戻る