pageX プロパティ
pageX プロパティは、ドキュメント上のポインターの水平座標を返す MouseEvent のプロパティです。エレメントの左上端が基準(0,0)です。
マウスポインターの垂直座標を取得するにはpageYプロパティを使用します。
document.getElementById('example').onpointermove = (event)=>{
console.log( event.pageX );
};
pageX プロパティは実験的なプロパティですが、ほとんどのブラウザが実装しています。
ページ内 Index
構文(Syntax)
返り値はNumber型で、読み取り専用です。
Number = event.pageX;
返り値(Return Values)
| Type | 摘要 |
|---|---|
| Number | マウスポインターの水平座標、単位はピクセル |
Example
pageX プロパティの例です。document の pointermove イベントによって取得した Event オブジェクトから pageX を取得しています。
関連プロパティ
座標の取得には以下の４つの方法があります。
| 座標の基準 | プロパティ名 |
|---|---|
| スクリーンデバイスの左上端 | event.screenX、event.screenY |
| ブラウザの表示エリアの左上端 | event.clientX、event.clientY |
| ドキュメントの左上端 | event.pageX、event.pageY |
| エレメントの左上端 | event.offsetX、event.offsetY |