JavaScript

[JavaScript] マウスポインタの座標を取得する

投稿日:2016年11月20日 更新日:

マウスポインタの座標位置をリアルタイムで取得するサンプルです。

サンプルソース

例)マウスを動かすとリアルタイムでX座標とY座標の位置を表示する

実行サンプル

マウスを動かすと以下にポインタの座標が表示されます。

X座標: Y座標:

解説

  • マウスポインタ座標は、mousemoveイベント引数のpageX、pageYで取得できます。
  • ページ全体で座標を取得したい場合は、BODYタグにmousemoveイベントを設定します。
  • 特定のタグ内で座標を取得したい場合は、対象のタグにmousemoveイベントを設定します。
  • jQuery版は、以下ページをご覧ください。
    [jQuery] マウスポインタの座標を取得する


スポンサーリンク

スポンサーリンク

-JavaScript
-, ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

[JavaScript] 四捨五入、切り捨て、切り上げを行う

四捨五入、切り捨て、切り上げを行うサンプルです。 四捨五入を行う 四捨五入は、Math.roundを使用します。 [cr ...

[JavaScript] 一定時間ごとに処理を実行する

一定時間ごとに処理を実行するサンプルです。 サンプル 例)1秒毎に現在時刻を表示する [crayon-5c10dc590 ...

[JavaScript] Function引数にデフォルト値を設定する

Function引数にデフォルト値を設定するサンプルです。 ※ECMAScript6対応ブラウザで使用できます。 サンプ ...

[JavaScript] ローカル時刻を取得する(.toLocaleString)

ローカル時刻を取得するには、.toLocaleString()を使用します。 サンプルソース 例)現在日時のローカル時刻 ...

[JavaScript] チェックボックスのチェック状態を取得する

チェックボックスのチェック状態を取得するサンプルです。 サンプルソース 例)ボタンを押すとチェックボックスの状態をアラー ...

スポンサーリンク