clientY プロパティ
clientY プロパティは、ポインターの Y 軸方向(垂直方向)の座標を返すEventのプロパティです。このプロパティは、ウィンドウの表示エリアの左上端が始点(0,0)になります。
ポインターに関するイベントは以下のポインターに関連するイベント
を参照してください。
document.getElementById("example").addEventListener("pointermove", (event)=>{ console.log( event.clientY ); });
ポインターの座標の値には、座標の基準によって異なるプロパティがあります。詳しくは以下の座標の取得
を参照してください。
X 軸方向の座標を取得するには clientX プロパティを使用します。
ページ内 Index
座標の取得
座標の取得には以下の4つの方法があります。
スクリーンデバイスの左上端 | event.screenX、event.screenY |
ウィンドウの表示エリアの左上端 | event.clientX、event.clientY |
ドキュメントの左上端 | event.pageX、event.pageY |
エレメントの左上端 | event.offsetX、event.offsetY |
構文(Syntax)
返り値はNumber型、読み取り専用です。
Number = event.clientY;
戻り値(Return Values)
type | 摘要 |
---|---|
Number | マウスポインタの垂直座標(ピクセル単位) |
Example
clientY プロパティの例です。
clientY プロパティの基準はウィンドウの表示領域の左上端になります。
以下の例では <iframe> によって別ウィンドウが表示されています。
<iframe> の表示領域の左上端が基準( 0, 0 )になります。
ポインターに関連するイベント
以下はポインターに関連するイベントです。
ポインティングデバイス | |
---|---|
イベント | 概要 |
gotpointercapture ( ongotpointercapture ) | ポインターイベントのキャプチャー対象に設定されたら |
lostpointercapture ( onlostpointercapture ) | ポインターイベントのキャプチャー対象から外れたら |
pointercancel ( onpointercancel ) | ポインターによるイベントが発生しないとなったとき |
pointerdown ( onpointerdown ) | ポインターは押されたら |
pointerenter ( onpointerenter ) | ポインターが領域上に入ったら |
pointerleave ( onpointerleave ) | ポインターが領域上から離れたら |
pointermove ( onpointermove ) | ポインターが移動したら |
pointerout ( onpointerout ) | ポインターが反応条件から離れたら |
pointerover ( onpointerover ) | ポインターが領域内に入ったら |
pointerup ( onpointerup ) | ポインターがアクティブでなくなったら |