MouseEvent screenX属性

DOM イベント MouseEvent

定義と使用方法

screenX属性は、イベントが発生したときのマウス指標の水平座標（ユーザーのコンピュータスクリーンに対して）を返します。

ヒント：マウス指標の垂直座標（ユーザーのコンピュータスクリーンに対して）を取得するには、 screenY 属性

注釈：この属性は読み取り専用です。

例

例1

要素上でマウスボタンをクリックしたとき、マウス指標のスクリーン上の座標を取得：

var x = event.screenX;     // 水平座標を取得
var y = event.screenY;     // 垂直座標を取得
var coor = "X coords: " + x + ", Y coords: " + y;

実際に試してみてください

例2

clientXとclientY、screenXとscreenYの違いを示すデモ：

var cX = event.clientX;
var sX = event.screenX;
var cY = event.clientY;
var sY = event.screenY;
var coords1 = "client - X: " + cX + ", Y coords: " + cY;
var coords2 = "screen - X: " + sX + ", Y coords: " + sY;

実際に試してみてください

構文

event.screenX

技術的詳細

返り値： ピクセル単位で示される水平座標の数値。
DOMバージョン： DOMレベル2イベント

ブラウザのサポート

属性 Chrome IE Firefox Safari Opera
screenX サポート サポート サポート サポート サポート

関連ページ

HTML DOM リファレンスマニュアル：MouseEvent screenY プロパティ

HTML DOM リファレンスマニュアル：MouseEvent clientX プロパティ

HTML DOM リファレンスマニュアル：MouseEvent clientY プロパティ

HTML DOM リファレンスマニュアル：MouseEvent offsetX プロパティ

HTML DOM リファレンスマニュアル：MouseEvent offsetY プロパティ

DOM イベント MouseEvent