JavaScript入門 | ブラウザオブジェクトモデル | Screenオブジェクト

Tags:

Screenオブジェクト

screenオブジェクトは、ユーザーのディスプレイ画面に関するさまざまな情報を保存するオブジェクトである。

ユーザーの画面サイズ

screenオブジェクトのwidthプロパティとheightプロパティは、ユーザーのディスプレイ画面のサイズをピクセル単位で返す。

document.write("現在のユーザーのディスプレイ画面の幅は " + screen.width + " ピクセルです。<br>");
document.write("現在のユーザーのディスプレイ画面の高さは " + screen.height + " ピクセルです。<br>");
 
document.write("現在のブラウザウィンドウの幅は " + window.outerWidth + " ピクセルです。<br>");
document.write("現在のブラウザウィンドウの高さは " + window.outerHeight + " ピクセルです。<br>");

screen.widthとscreen.heightは、現在のユーザーのモニター画面のサイズを返す。しかし、window.outerWidthとwindow.outerHeightは現在のブラウザウィンドウのサイズを返す。

実際に使用できる画面サイズ

screenオブジェクトのavailWidthプロパティとavailHeightプロパティは、実際に使用できる画面のサイズをピクセル単位で返す。このプロパティは、オペレーティングシステムのタスクバーなどの領域をすべて除いたサイズを返す。

document.write("実際に使用できる画面の幅は " + screen.availWidth + " ピクセルです。<br>");
document.write("実際に使用できる画面の高さは " + screen.availHeight + " ピクセルです。");

1色あたりに使用できるビット数

screenオブジェクトのcolorDepthプロパティは、ユーザー画面で1色あたりに使用できるビット数を返す。ほとんどのコンピュータは24ビットのトゥルーカラー、または30/36/48ビットのディープカラーを使用する。

var bitColorDepth = screen.colorDepth;
document.write("ユーザー画面で1色あたりに使用できるビット数は " + bitColorDepth + " 個です。<br>");
document.write("つまり、1色は合計 " + Math.pow(2, bitColorDepth) + " 通りで表現されます。");

トゥルーカラーで1色あたりに使用できるビット数は224 = 16,777,216である。

画面の1ピクセルあたりに表示できるビット数

screenオブジェクトのpixelDepthプロパティは、ユーザー画面で1ピクセルあたりに表示できるビット数を返す。

var bitPixelDepth = screen.pixelDepth;
document.write("ユーザー画面の1ピクセルあたりに表示できるビット数は " + bitPixelDepth + " 個です。<br>");

ほとんどのコンピュータでは、colorDepthとpixelDepthは同じ値を持つ。