JavaScript

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

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

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

サンプルソース

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

実行サンプル

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

X座標: Y座標:

解説

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


スポンサーリンク

スポンサーリンク

-JavaScript
-, ,

執筆者:


comment

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

関連記事

[JavaScript] 数値が有限数かどうかチェックを行う(isFinite)

数値が有限数かどうかチェックをするには、isFinite()関数を使用します。 サンプル 例)isFinite関数の結果 ...

[JavaScript] コンソールにオブジェクトの中身をテーブル形式で出力する(console.table)

コンソールにオブジェクトの中身をテーブル形式で出力するには、console.tableを使用します。 サンプルソース 例 ...

[JavaScript] セレクトボックスの選択中のインデックス番号を取得する

セレクトボックスの選択中のインデックス番号を取得するサンプルです。 サンプルソース 例)ボタンを押すと、セレクトボックス ...

[JavaScript] canvasオブジェクトを生成する

JavaScriptでcanvasオブジェクトを生成する方法です。 サンプルソース 例)canvasオブジェクトを生成す ...

[JavaScript] 配列の最後の要素を取り出す(.pop)

配列の最後の要素を取り出すには、.pop()を使用します。 サンプルソース 例)配列の末尾の要素を取得する [crayo ...

スポンサーリンク