From 36eb7d19909f719191376481da6b121ec6272c65 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Fri, 31 Dec 2021 21:21:17 +0900 Subject: Web/API/MouseEvent 以下の文書を更新準備 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- files/ja/web/api/mouseevent/altkey/index.html | 45 ----- files/ja/web/api/mouseevent/altkey/index.md | 45 +++++ files/ja/web/api/mouseevent/button/index.html | 110 ------------ files/ja/web/api/mouseevent/button/index.md | 110 ++++++++++++ files/ja/web/api/mouseevent/buttons/index.html | 101 ----------- files/ja/web/api/mouseevent/buttons/index.md | 101 +++++++++++ files/ja/web/api/mouseevent/clientx/index.html | 74 --------- files/ja/web/api/mouseevent/clientx/index.md | 74 +++++++++ files/ja/web/api/mouseevent/ctrlkey/index.html | 75 --------- files/ja/web/api/mouseevent/ctrlkey/index.md | 75 +++++++++ files/ja/web/api/mouseevent/index.html | 194 ---------------------- files/ja/web/api/mouseevent/index.md | 194 ++++++++++++++++++++++ files/ja/web/api/mouseevent/mouseevent/index.html | 179 -------------------- files/ja/web/api/mouseevent/mouseevent/index.md | 179 ++++++++++++++++++++ files/ja/web/api/mouseevent/screenx/index.html | 84 ---------- files/ja/web/api/mouseevent/screenx/index.md | 84 ++++++++++ files/ja/web/api/mouseevent/shiftkey/index.html | 76 --------- files/ja/web/api/mouseevent/shiftkey/index.md | 76 +++++++++ 18 files changed, 938 insertions(+), 938 deletions(-) delete mode 100644 files/ja/web/api/mouseevent/altkey/index.html create mode 100644 files/ja/web/api/mouseevent/altkey/index.md delete mode 100644 files/ja/web/api/mouseevent/button/index.html create mode 100644 files/ja/web/api/mouseevent/button/index.md delete mode 100644 files/ja/web/api/mouseevent/buttons/index.html create mode 100644 files/ja/web/api/mouseevent/buttons/index.md delete mode 100644 files/ja/web/api/mouseevent/clientx/index.html create mode 100644 files/ja/web/api/mouseevent/clientx/index.md delete mode 100644 files/ja/web/api/mouseevent/ctrlkey/index.html create mode 100644 files/ja/web/api/mouseevent/ctrlkey/index.md delete mode 100644 files/ja/web/api/mouseevent/index.html create mode 100644 files/ja/web/api/mouseevent/index.md delete mode 100644 files/ja/web/api/mouseevent/mouseevent/index.html create mode 100644 files/ja/web/api/mouseevent/mouseevent/index.md delete mode 100644 files/ja/web/api/mouseevent/screenx/index.html create mode 100644 files/ja/web/api/mouseevent/screenx/index.md delete mode 100644 files/ja/web/api/mouseevent/shiftkey/index.html create mode 100644 files/ja/web/api/mouseevent/shiftkey/index.md diff --git a/files/ja/web/api/mouseevent/altkey/index.html b/files/ja/web/api/mouseevent/altkey/index.html deleted file mode 100644 index ffa370b596..0000000000 --- a/files/ja/web/api/mouseevent/altkey/index.html +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: event.altKey -slug: Web/API/MouseEvent/altKey -tags: - - DOM - - Gecko - - Gecko DOM Reference -translation_of: Web/API/MouseEvent/altKey -translation_of_original: Web/API/event.altKey ---- -

{{ ApiRef() }}

-

Summary

-

イベントが発生したときALTキーが押されていたかどうかを示します。

-

Syntax

-
bool = event.altKey
-
-

bool は true か false であり、イベントが発生したときに ALT キーが押されていたかどうかを示しています。

-

Example

-
<html>
-<head>
-<title>altKey example</title>
-
-<script type="text/javascript">
-
-function showChar(e){
-  alert(
-    "Key Pressed: " + String.fromCharCode(e.charCode) + "\n"
-    + "charCode: " + e.charCode + "\n"
-    + "ALT key pressed: " + e.altKey + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onkeypress="showChar(event);">
-<p>
-Press any character key,
-with or without holding down the ALT key.<br />
-You can also use the SHIFT key together with the ALT key.
-</p>
-</body>
-</html>
-
-

{{ languages( { "en": "en/DOM/event.altKey", "pl": "pl/DOM/event.altKey" } ) }}

diff --git a/files/ja/web/api/mouseevent/altkey/index.md b/files/ja/web/api/mouseevent/altkey/index.md new file mode 100644 index 0000000000..ffa370b596 --- /dev/null +++ b/files/ja/web/api/mouseevent/altkey/index.md @@ -0,0 +1,45 @@ +--- +title: event.altKey +slug: Web/API/MouseEvent/altKey +tags: + - DOM + - Gecko + - Gecko DOM Reference +translation_of: Web/API/MouseEvent/altKey +translation_of_original: Web/API/event.altKey +--- +

{{ ApiRef() }}

+

Summary

+

イベントが発生したときALTキーが押されていたかどうかを示します。

+

Syntax

+
bool = event.altKey
+
+

bool は true か false であり、イベントが発生したときに ALT キーが押されていたかどうかを示しています。

+

Example

+
<html>
+<head>
+<title>altKey example</title>
+
+<script type="text/javascript">
+
+function showChar(e){
+  alert(
+    "Key Pressed: " + String.fromCharCode(e.charCode) + "\n"
+    + "charCode: " + e.charCode + "\n"
+    + "ALT key pressed: " + e.altKey + "\n"
+  );
+}
+
+</script>
+</head>
+
+<body onkeypress="showChar(event);">
+<p>
+Press any character key,
+with or without holding down the ALT key.<br />
+You can also use the SHIFT key together with the ALT key.
+</p>
+</body>
+</html>
+
+

{{ languages( { "en": "en/DOM/event.altKey", "pl": "pl/DOM/event.altKey" } ) }}

diff --git a/files/ja/web/api/mouseevent/button/index.html b/files/ja/web/api/mouseevent/button/index.html deleted file mode 100644 index 71aab88fe7..0000000000 --- a/files/ja/web/api/mouseevent/button/index.html +++ /dev/null @@ -1,110 +0,0 @@ ---- -title: MouseEvent.button -slug: Web/API/MouseEvent/button -tags: - - API - - DOM - - DOM Events - - MouseEvent - - Property - - Read-only - - Reference -translation_of: Web/API/MouseEvent/button ---- -

{{APIRef("DOM Events")}}

- -

読み取り専用プロパティ MouseEvent.button はイベントのトリガーとなったのがどのボタンが押されたのかを表します。

- -

このプロパティは、1つまたは複数のボタンを押したり離したりすることによって発生したイベント中にどのボタンが押されたかを示すことのみを保証します。したがって、 {{event("mouseenter")}}, {{event("mouseleave")}}, {{event("mouseover")}}, {{event("mouseout")}} ,{{event("mousemove")}} のようなイベントに対しては確かではありません。

- -

ユーザーはポインティングデバイスの設定を変更できるため、例えばイベントのボタンプロパティがゼロだった場合、必ずしも物理的な左ボタンによるものとは限りません。ただし、そのような場合でも標準設定における左ボタンと同じ動作をするべきです。

- -
-

Note: 全てのマウスイベントで扱える、複数のボタンを同時に押下されていることを表せる {{domxref("MouseEvent.buttons")}} プロパティと混同しないように注意してください。

-
- -

構文

- -
var buttonPressed = instanceOfMouseEvent.button
-
- -

戻り値

- -

該当するボタンに対応する番号:

- - - -

上記のように、ボタンは標準の「左から右へ」のレイアウトとは異なるように構成されてもよいく、左利き用に設定されたマウスでは、ボタンの動作が逆になることがあります。いくつかのポインティングデバイスは１つのボタンしか持たず、キーボードまたは他の入力機構を使用して主、副、補助などを示します。他のポインティングデバイスは多くのボタンを異なる機能およびボタン値にマッピングすることができます。

- -

例

- -

 

- -

HTML

- -
<button id="button" oncontextmenu="event.preventDefault();">Click here with your mouse...</button>
-<p id="log"></p>
-
- -

JavaScript

- -
let button = document.querySelector('#button');
-let log = document.querySelector('#log');
-button.addEventListener('mouseup', logMouseButton);
-
-function logMouseButton(e) {
-  if (typeof e === 'object') {
-    switch (e.button) {
-      case 0:
-        log.textContent = 'Left button clicked.';
-        break;
-      case 1:
-        log.textContent = 'Middle button clicked.';
-        break;
-      case 2:
-        log.textContent = 'Right button clicked.';
-        break;
-      default:
-        log.textContent = `Unknown button code: ${btnCode}`;
-    }
-  }
-}
-
- -

仕様

- - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('DOM3 Events','#widl-MouseEvent-button','MouseEvent.button')}}{{Spec2('DOM3 Events')}}Compared to {{SpecName('DOM2 Events')}}, the return value can be negative.
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.button')}}{{Spec2('DOM2 Events')}}Initial definition.
- -

ブラウザ実装状況

- -
{{Compat("api.MouseEvent.button")}}
- -

関連情報

- - diff --git a/files/ja/web/api/mouseevent/button/index.md b/files/ja/web/api/mouseevent/button/index.md new file mode 100644 index 0000000000..71aab88fe7 --- /dev/null +++ b/files/ja/web/api/mouseevent/button/index.md @@ -0,0 +1,110 @@ +--- +title: MouseEvent.button +slug: Web/API/MouseEvent/button +tags: + - API + - DOM + - DOM Events + - MouseEvent + - Property + - Read-only + - Reference +translation_of: Web/API/MouseEvent/button +--- +

{{APIRef("DOM Events")}}

+ +

読み取り専用プロパティ MouseEvent.button はイベントのトリガーとなったのがどのボタンが押されたのかを表します。

+ +

このプロパティは、1つまたは複数のボタンを押したり離したりすることによって発生したイベント中にどのボタンが押されたかを示すことのみを保証します。したがって、 {{event("mouseenter")}}, {{event("mouseleave")}}, {{event("mouseover")}}, {{event("mouseout")}} ,{{event("mousemove")}} のようなイベントに対しては確かではありません。

+ +

ユーザーはポインティングデバイスの設定を変更できるため、例えばイベントのボタンプロパティがゼロだった場合、必ずしも物理的な左ボタンによるものとは限りません。ただし、そのような場合でも標準設定における左ボタンと同じ動作をするべきです。

+ +
+

Note: 全てのマウスイベントで扱える、複数のボタンを同時に押下されていることを表せる {{domxref("MouseEvent.buttons")}} プロパティと混同しないように注意してください。

+
+ +

構文

+ +
var buttonPressed = instanceOfMouseEvent.button
+
+ +

戻り値

+ +

該当するボタンに対応する番号:

+ + + +

上記のように、ボタンは標準の「左から右へ」のレイアウトとは異なるように構成されてもよいく、左利き用に設定されたマウスでは、ボタンの動作が逆になることがあります。いくつかのポインティングデバイスは１つのボタンしか持たず、キーボードまたは他の入力機構を使用して主、副、補助などを示します。他のポインティングデバイスは多くのボタンを異なる機能およびボタン値にマッピングすることができます。

+ +

例

+ +

 

+ +

HTML

+ +
<button id="button" oncontextmenu="event.preventDefault();">Click here with your mouse...</button>
+<p id="log"></p>
+
+ +

JavaScript

+ +
let button = document.querySelector('#button');
+let log = document.querySelector('#log');
+button.addEventListener('mouseup', logMouseButton);
+
+function logMouseButton(e) {
+  if (typeof e === 'object') {
+    switch (e.button) {
+      case 0:
+        log.textContent = 'Left button clicked.';
+        break;
+      case 1:
+        log.textContent = 'Middle button clicked.';
+        break;
+      case 2:
+        log.textContent = 'Right button clicked.';
+        break;
+      default:
+        log.textContent = `Unknown button code: ${btnCode}`;
+    }
+  }
+}
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM3 Events','#widl-MouseEvent-button','MouseEvent.button')}}{{Spec2('DOM3 Events')}}Compared to {{SpecName('DOM2 Events')}}, the return value can be negative.
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.button')}}{{Spec2('DOM2 Events')}}Initial definition.
+ +

ブラウザ実装状況

+ +
{{Compat("api.MouseEvent.button")}}
+ +

関連情報

+ + diff --git a/files/ja/web/api/mouseevent/buttons/index.html b/files/ja/web/api/mouseevent/buttons/index.html deleted file mode 100644 index 1854c11fda..0000000000 --- a/files/ja/web/api/mouseevent/buttons/index.html +++ /dev/null @@ -1,101 +0,0 @@ ---- -title: MouseEvent.buttons -slug: Web/API/MouseEvent/buttons -translation_of: Web/API/MouseEvent/buttons ---- -
{{APIRef("DOM Events")}}
- -

The MouseEvent.buttons read-only property indicates which buttons are pressed on the mouse (or other input device) when a mouse event is triggered.

- -

Each button that can be pressed is represented by a given number (see below). If more than one button is pressed, the button values are added together to produce a new number. For example, if the secondary (2) and auxilary (4) buttons are pressed simultaneously, the value is 6 (i.e., 2 + 4).

- -
-

Note: Do not confuse this property with the {{domxref("MouseEvent.button")}} property. The {{domxref("MouseEvent.buttons")}} property indicates the state of buttons pressed during any kind of mouse event, while the {{domxref("MouseEvent.button")}} property only guarantees the correct value for mouse events caused by pressing or releasing one or multiple buttons.

-
- -

Syntax

- -
var buttonsPressed = instanceOfMouseEvent.buttons
-
- -

Return value

- -

A number representing one or more buttons. For more than one button pressed simultaneously, the values are combined (e.g., 3 is primary + secondary).

- - - -

Example

- -

This example logs the buttons property when you trigger a {{Event("mousedown")}} event.

- -

HTML

- -
<p>Click anywhere with one or more mouse buttons.</p>
-<p id="log">buttons: </p>
- -

JavaScript

- -
let button = document.querySelector('#button');
-let log = document.createTextNode('?');
-document.addEventListener('mousedown', logButtons);
-
-function logButtons(e) {
-  log.data = `${e.buttons} (mousedown)`;
-}
-document.addEventListener('mouseup', unpress);
-function unpress(e) {
-  log.data = `${e.buttons} (mouseup)`
-}
-document.querySelector('#log').appendChild(log)
- -

Result

- -

{{EmbedLiveSample("Example")}}

- -

Specifications

- - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('DOM3 Events','#widl-MouseEvent-buttons','MouseEvent.buttons')}}{{Spec2('DOM3 Events')}}Initial definition
- -

Browser compatibility

- - - -

{{Compat("api.MouseEvent.buttons")}}

- -

Firefox notes

- -

Firefox supports the buttons attribute on Windows, Linux (GTK), and macOS with the following restrictions:

- - - -

See also

- - diff --git a/files/ja/web/api/mouseevent/buttons/index.md b/files/ja/web/api/mouseevent/buttons/index.md new file mode 100644 index 0000000000..1854c11fda --- /dev/null +++ b/files/ja/web/api/mouseevent/buttons/index.md @@ -0,0 +1,101 @@ +--- +title: MouseEvent.buttons +slug: Web/API/MouseEvent/buttons +translation_of: Web/API/MouseEvent/buttons +--- +
{{APIRef("DOM Events")}}
+ +

The MouseEvent.buttons read-only property indicates which buttons are pressed on the mouse (or other input device) when a mouse event is triggered.

+ +

Each button that can be pressed is represented by a given number (see below). If more than one button is pressed, the button values are added together to produce a new number. For example, if the secondary (2) and auxilary (4) buttons are pressed simultaneously, the value is 6 (i.e., 2 + 4).

+ +
+

Note: Do not confuse this property with the {{domxref("MouseEvent.button")}} property. The {{domxref("MouseEvent.buttons")}} property indicates the state of buttons pressed during any kind of mouse event, while the {{domxref("MouseEvent.button")}} property only guarantees the correct value for mouse events caused by pressing or releasing one or multiple buttons.

+
+ +

Syntax

+ +
var buttonsPressed = instanceOfMouseEvent.buttons
+
+ +

Return value

+ +

A number representing one or more buttons. For more than one button pressed simultaneously, the values are combined (e.g., 3 is primary + secondary).

+ + + +

Example

+ +

This example logs the buttons property when you trigger a {{Event("mousedown")}} event.

+ +

HTML

+ +
<p>Click anywhere with one or more mouse buttons.</p>
+<p id="log">buttons: </p>
+ +

JavaScript

+ +
let button = document.querySelector('#button');
+let log = document.createTextNode('?');
+document.addEventListener('mousedown', logButtons);
+
+function logButtons(e) {
+  log.data = `${e.buttons} (mousedown)`;
+}
+document.addEventListener('mouseup', unpress);
+function unpress(e) {
+  log.data = `${e.buttons} (mouseup)`
+}
+document.querySelector('#log').appendChild(log)
+ +

Result

+ +

{{EmbedLiveSample("Example")}}

+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM3 Events','#widl-MouseEvent-buttons','MouseEvent.buttons')}}{{Spec2('DOM3 Events')}}Initial definition
+ +

Browser compatibility

+ + + +

{{Compat("api.MouseEvent.buttons")}}

+ +

Firefox notes

+ +

Firefox supports the buttons attribute on Windows, Linux (GTK), and macOS with the following restrictions:

+ + + +

See also

+ + diff --git a/files/ja/web/api/mouseevent/clientx/index.html b/files/ja/web/api/mouseevent/clientx/index.html deleted file mode 100644 index 3c4bdf53b2..0000000000 --- a/files/ja/web/api/mouseevent/clientx/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: MouseEvent.clientX -slug: Web/API/MouseEvent/clientX -translation_of: Web/API/MouseEvent/clientX ---- -

{{APIRef("DOM Events")}}

- -

MouseEvent.clientX は event の起きた点の、クライアント内での X 座標を参照できる読み取り専用の属性です。画面の左上でクリックした場合、ページの横スクロール位置に関わらず、その値は 0 となります。

- -

記法

- -
var x = instanceOfMouseEvent.clientX
-
- -

返り値

- -

数値

- -

使用例

- -
<!DOCTYPE html>
-<html>
-<head>
-<title>clientX\clientY example</title>
-
-<script>
-function showCoords(evt){
-  alert(
-    "clientX value: " + evt.clientX + "\n" +
-    "clientY value: " + evt.clientY + "\n"
-  );
-}
-</script>
-</head>
-
-<body onmousedown="showCoords(event)">
-<p>To display the mouse coordinates click anywhere on the page.</p>
-</body>
-</html>
-
- -

仕様

- - - - - - - - - - - - - - - - - - - -
仕様状態コメント
{{SpecName('DOM3 Events','#widl-MouseEvent-clientX','MouseEvent.clientX')}}{{Spec2('DOM3 Events')}}{{SpecName('DOM2 Events')}} からの変更はなし
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.clientX')}}{{Spec2('DOM2 Events')}}最初の定義
- -

ブラウザ互換性

- -

{{Compat("api.MouseEvent.clientX")}}

- -

関連情報

- - diff --git a/files/ja/web/api/mouseevent/clientx/index.md b/files/ja/web/api/mouseevent/clientx/index.md new file mode 100644 index 0000000000..3c4bdf53b2 --- /dev/null +++ b/files/ja/web/api/mouseevent/clientx/index.md @@ -0,0 +1,74 @@ +--- +title: MouseEvent.clientX +slug: Web/API/MouseEvent/clientX +translation_of: Web/API/MouseEvent/clientX +--- +

{{APIRef("DOM Events")}}

+ +

MouseEvent.clientX は event の起きた点の、クライアント内での X 座標を参照できる読み取り専用の属性です。画面の左上でクリックした場合、ページの横スクロール位置に関わらず、その値は 0 となります。

+ +

記法

+ +
var x = instanceOfMouseEvent.clientX
+
+ +

返り値

+ +

数値

+ +

使用例

+ +
<!DOCTYPE html>
+<html>
+<head>
+<title>clientX\clientY example</title>
+
+<script>
+function showCoords(evt){
+  alert(
+    "clientX value: " + evt.clientX + "\n" +
+    "clientY value: " + evt.clientY + "\n"
+  );
+}
+</script>
+</head>
+
+<body onmousedown="showCoords(event)">
+<p>To display the mouse coordinates click anywhere on the page.</p>
+</body>
+</html>
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('DOM3 Events','#widl-MouseEvent-clientX','MouseEvent.clientX')}}{{Spec2('DOM3 Events')}}{{SpecName('DOM2 Events')}} からの変更はなし
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.clientX')}}{{Spec2('DOM2 Events')}}最初の定義
+ +

ブラウザ互換性

+ +

{{Compat("api.MouseEvent.clientX")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/mouseevent/ctrlkey/index.html b/files/ja/web/api/mouseevent/ctrlkey/index.html deleted file mode 100644 index 920a4cae65..0000000000 --- a/files/ja/web/api/mouseevent/ctrlkey/index.html +++ /dev/null @@ -1,75 +0,0 @@ ---- -title: MouseEvent.ctrlKey -slug: Web/API/MouseEvent/ctrlKey -translation_of: Web/API/MouseEvent/ctrlKey ---- -

{{APIRef("DOM Events")}}

- -

読み取り専用プロパティ MouseEvent.ctrlKey は、イベント発生時に control キーが押されたかどうかを、押されていた (true) または押されていない (false) の{{jsxref("Boolean")}} で返します。

- -

構文

- -
var ctrlKeyPressed = instanceOfMouseEvent.ctrlKey
-
- -

戻り値

- -

A boolean

- -

例

- -
<html>
-<head>
-<title>ctrlKey使用例</title>
-
-<script type="text/javascript">
-
-function showChar(e){
-  alert(
-    "Key Pressed: " + String.fromCharCode(e.charCode) + "\n"
-    + "charCode: " + e.charCode + "\n"
-    + "CTRL key pressed: " + e.ctrlKey + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onkeypress="showChar(event);">
-<p>何か文字キーを単体またはCTRLキーと同時に押してください。<br />
-また、CTRLキーに加え、SHIFTキーも同時に使用できます。</p>
-</body>
-</html>
-
- -

仕様

- - - - - - - - - - - - - - - - - - - -
SpecificationStatusComment
{{SpecName('DOM3 Events','#widl-MouseEvent-ctrlKey','MouseEvent.ctrlKey')}}{{Spec2('DOM3 Events')}}{{SpecName('DOM2 Events')}}から変更なし
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.ctrlKey')}}{{Spec2('DOM2 Events')}}最初期の定義
- -

ブラウザ互換性

- -

{{Compat("api.MouseEvent.ctrlKey")}}

- -

関連情報

- - diff --git a/files/ja/web/api/mouseevent/ctrlkey/index.md b/files/ja/web/api/mouseevent/ctrlkey/index.md new file mode 100644 index 0000000000..920a4cae65 --- /dev/null +++ b/files/ja/web/api/mouseevent/ctrlkey/index.md @@ -0,0 +1,75 @@ +--- +title: MouseEvent.ctrlKey +slug: Web/API/MouseEvent/ctrlKey +translation_of: Web/API/MouseEvent/ctrlKey +--- +

{{APIRef("DOM Events")}}

+ +

読み取り専用プロパティ MouseEvent.ctrlKey は、イベント発生時に control キーが押されたかどうかを、押されていた (true) または押されていない (false) の{{jsxref("Boolean")}} で返します。

+ +

構文

+ +
var ctrlKeyPressed = instanceOfMouseEvent.ctrlKey
+
+ +

戻り値

+ +

A boolean

+ +

例

+ +
<html>
+<head>
+<title>ctrlKey使用例</title>
+
+<script type="text/javascript">
+
+function showChar(e){
+  alert(
+    "Key Pressed: " + String.fromCharCode(e.charCode) + "\n"
+    + "charCode: " + e.charCode + "\n"
+    + "CTRL key pressed: " + e.ctrlKey + "\n"
+  );
+}
+
+</script>
+</head>
+
+<body onkeypress="showChar(event);">
+<p>何か文字キーを単体またはCTRLキーと同時に押してください。<br />
+また、CTRLキーに加え、SHIFTキーも同時に使用できます。</p>
+</body>
+</html>
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM3 Events','#widl-MouseEvent-ctrlKey','MouseEvent.ctrlKey')}}{{Spec2('DOM3 Events')}}{{SpecName('DOM2 Events')}}から変更なし
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.ctrlKey')}}{{Spec2('DOM2 Events')}}最初期の定義
+ +

ブラウザ互換性

+ +

{{Compat("api.MouseEvent.ctrlKey")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/mouseevent/index.html b/files/ja/web/api/mouseevent/index.html deleted file mode 100644 index 0eb9ca3791..0000000000 --- a/files/ja/web/api/mouseevent/index.html +++ /dev/null @@ -1,194 +0,0 @@ ---- -title: MouseEvent -slug: Web/API/MouseEvent -tags: - - API - - DOM - - DOM Events - - Interface - - MouseEvent - - Reference - - events - - mouse - - インターフェイス -translation_of: Web/API/MouseEvent ---- -
{{APIRef("DOM Events")}}
- -

MouseEvent インターフェイスは、ポインティングデバイス (マウスなど) によるユーザの対話によって発生したイベントを表します。このインターフェイスを使用する一般的なイベントとして {{event("click")}}, {{event("dblclick")}}, {{event("mouseup")}}, {{event("mousedown")}} があります。

- -

MouseEvent は {{domxref("UIEvent")}} から派生しており、これはさらに {{domxref("Event")}} から派生しています。後方互換性のために {{domxref("MouseEvent.initMouseEvent()")}} メソッドは維持されていますが、 MouseEvent オブジェクトを作成する際は {{domxref("MouseEvent.MouseEvent", "MouseEvent()")}} コンストラクターを使用するべきです。

- -

MouseEvent からは、 {{domxref("WheelEvent")}}, {{domxref("DragEvent")}} などの特定用途向けイベントが派生しています。

- -

{{InheritanceDiagram}}

- -

コンストラクター

- -
-
{{domxref("MouseEvent.MouseEvent", "MouseEvent()")}}
-
MouseEvent オブジェクトを生成します。
-
- -

プロパティ

- -

このインターフェイスは、親インターフェイスである {{domxref("UIEvent")}} および {{domxref("Event")}} のプロパティも継承しています。

- -
-
{{domxref("MouseEvent.altKey")}} {{readonlyinline}}
-
マウスイベントが発生したときに alt キーが押下されていれば、 true を返します。
-
{{domxref("MouseEvent.button")}} {{readonlyinline}}
-
マウスイベントが発生したときに押下されたボタンの番号 (もしあれば) です。
-
{{domxref("MouseEvent.buttons")}} {{readonlyinline}} {{gecko_minversion_inline("15.0")}}
-
マウスイベントが発生したときに離されていたボタンの番号 (もしあれば) です。
-
{{domxref("MouseEvent.clientX")}} {{readonlyinline}}
-
ローカル (DOM content) 座標における、マウスポインターの X 座標。
-
{{domxref("MouseEvent.clientY")}} {{readonlyinline}}
-
ローカル (DOM content) 座標における、マウスポインターの Y 座標。
-
{{domxref("MouseEvent.ctrlKey")}} {{readonlyinline}}
-
マウスイベントが発生したときに control キーが押下されていれば、 true を返します。
-
{{domxref("MouseEvent.metaKey")}} {{readonlyinline}}
-
マウスイベントが発生したときに meta キーが押下されていれば、 true を返します。
-
{{domxref("MouseEvent.movementX")}} {{readonlyinline}}
-
前の {{event("mousemove")}} イベントの位置に対して相対的な、マウスポインタの X 座標。
-
{{domxref("MouseEvent.movementY")}} {{readonlyinline}}
-
前の {{event("mousemove")}} イベントの位置に対して相対的な、マウスポインタの Y 座標。
-
{{domxref("MouseEvent.offsetX")}} {{readonlyinline}}{{experimental_inline}}
-
対象ノードのパディング境界の位置に対して相対的な、マウスポインタの X 座標。
-
{{domxref("MouseEvent.offsetY")}} {{readonlyinline}}{{experimental_inline}}
-
対象ノードのパディング境界の位置に対して相対的な、マウスポインタの Y 座標。
-
{{domxref("MouseEvent.pageX")}} {{readonlyinline}}{{experimental_inline}}
-
ドキュメント全体に対して相対的な、マウスポインタの X 座標。
-
{{domxref("MouseEvent.pageY")}} {{readonlyinline}}{{experimental_inline}}
-
ドキュメント全体に対して相対的な、マウスポインタの Y 座標。
-
{{domxref("MouseEvent.region")}} {{readonlyinline}}
-
イベントの影響を受けたヒット領域の ID を返します。影響を受けたヒット領域がない場合は、null を返します。
-
{{domxref("MouseEvent.relatedTarget")}} {{readonlyinline}}
-
イベントのセカンダリターゲットがあれば、それを表します。
-
{{domxref("MouseEvent.screenX")}} {{readonlyinline}}
-
グローバル (スクリーン) 座標における、マウスポインタの X 座標。
-
{{domxref("MouseEvent.screenY")}} {{readonlyinline}}
-
グローバル (スクリーン) 座標における、マウスポインタの Y 座標。
-
{{domxref("MouseEvent.shiftKey")}} {{readonlyinline}}
-
マウスイベントが発生したときに shift キーが押下されていれば、true を返します。
-
{{domxref("MouseEvent.which")}} {{non-standard_inline}} {{readonlyinline}}
-
マウスイベントが発生したときに押下されていたボタン。
-
{{domxref("MouseEvent.mozPressure")}} {{non-standard_inline()}} {{deprecated_inline}} {{readonlyinline}}
-
イベントが生成されたとき、タッチデバイスやタブレットデバイスに与えられた圧力の大きさです。この値の範囲は、0.0 (最小圧力) から 1.0 (最大圧力) の間です。このプロパティは非推奨 (または非標準) なので、代わりに {{domxref("PointerEvent")}} を使用し、 {{domxref("PointerEvent.pressure", "pressure")}} プロパティを見てください。
-
{{domxref("MouseEvent.mozInputSource")}} {{non-standard_inline()}} {{readonlyinline}}
-
イベントを生成したデバイスの種類 (MOZ_SOURCE_* 定数のいずれか)。これにより、例えばマウスイベントが実際のマウスによって発生したのか、あるいはタッチイベントによって発生したのかを識別できます (これは、イベントに関連する座標を解釈する際の正確さに影響を与えるでしょう)。
-
{{domxref("MouseEvent.webkitForce")}} {{non-standard_inline()}} {{readonlyinline}}
-
クリック時に与えられた圧力。
-
{{domxref("MouseEvent.x")}} {{experimental_inline}}{{readonlyinline}}
-
{{domxref("MouseEvent.clientX")}} の別名。
-
{{domxref("MouseEvent.y")}} {{experimental_inline}}{{readonlyinline}}
-
{{domxref("MouseEvent.clientY")}} の別名。
-
- -

定数

- -
-
{{domxref("MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN")}} {{non-standard_inline}}{{readonlyinline}}
-
通常のクリックに必要な最小圧力。
-
{{domxref("MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN")}} {{non-standard_inline}}{{readonlyinline}}
-
強めのクリック (force click)に必要な最小圧力。
-
- -

メソッド

- -

このインターフェイスは、親インターフェイスである {{domxref("UIEvent")}} および {{domxref("Event")}} のメソッドも継承します。

- -
-
{{domxref("MouseEvent.getModifierState()")}}
-
指定した修飾キーの現在の状態を返します。詳しくは {{domxref("KeyboardEvent.getModifierState")}}() をご覧ください。
-
{{domxref("MouseEvent.initMouseEvent()")}} {{deprecated_inline}}
-
作成した MouseEvent の値を初期化します。イベントがすでにディスパッチされている場合は、何も行いません。
-
- -

例

- -

この例は、 DOM メソッドを使用してチェックボックスのクリックをシミュレーション (すなわち、プログラムで click イベントを生成) しています。

- -

HTML

- -
<p><label><input type="checkbox" id="checkbox"> Checked</label>
-<p><button id="button">Click me</button>
- -

JavaScript

- -
function simulateClick() {
-  var evt = new MouseEvent("click", {
-    bubbles: true,
-    cancelable: true,
-    view: window
-  });
-  var cb = document.getElementById("checkbox"); //element to click on
-  var canceled = !cb.dispatchEvent(evt);
-  if(canceled) {
-    // ハンドラで preventDefault を呼び出した場合
-    alert("canceled");
-  } else {
-    // ハンドラで preventDefault を呼び出さない場合
-    alert("not canceled");
-  }
-}
-document.getElementById("button").addEventListener('click', simulateClick);
- -

結果

- -

{{EmbedLiveSample('Example')}}

- -

仕様書

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
仕様書状態備考
{{SpecName('CSSOM View','#extensions-to-the-mouseevent-interface', 'MouseEvent')}}{{Spec2('CSSOM View')}}MouseEvent を long から double へ再定義。すなわち PointerEvent の pointerType がマウスの場合、 double になります。
{{SpecName('Pointer Lock','#extensions-to-the-mouseevent-interface','MouseEvent')}}{{Spec2('Pointer Lock')}}{{SpecName('DOM3 Events')}} に movementX および movementY プロパティを追加。
{{SpecName('CSSOM View', '#extensions-to-the-mouseevent-interface', 'MouseEvent')}}{{Spec2('CSSOM View')}}{{SpecName('DOM3 Events')}} に offsetX, offsetY, pageX, pageY, x, y プロパティを追加。 screen, page, client, coordinate (x / y) プロパティを long から double へ変更。
{{SpecName('UI Events', '#interface-mouseevent', 'MouseEvent')}}{{Spec2('UI Events')}}
{{SpecName('DOM3 Events','#events-mouseevents','MouseEvent')}}{{Spec2('DOM3 Events')}}{{SpecName('DOM2 Events')}} に MouseEvent() コンストラクタ、getModifierState() メソッド、buttons プロパティを追加。
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent')}}{{Spec2('DOM2 Events')}}初回定義
- -

ブラウザーの互換性

- -

{{Compat("api.MouseEvent")}}

- -

関連情報

- - diff --git a/files/ja/web/api/mouseevent/index.md b/files/ja/web/api/mouseevent/index.md new file mode 100644 index 0000000000..0eb9ca3791 --- /dev/null +++ b/files/ja/web/api/mouseevent/index.md @@ -0,0 +1,194 @@ +--- +title: MouseEvent +slug: Web/API/MouseEvent +tags: + - API + - DOM + - DOM Events + - Interface + - MouseEvent + - Reference + - events + - mouse + - インターフェイス +translation_of: Web/API/MouseEvent +--- +
{{APIRef("DOM Events")}}
+ +

MouseEvent インターフェイスは、ポインティングデバイス (マウスなど) によるユーザの対話によって発生したイベントを表します。このインターフェイスを使用する一般的なイベントとして {{event("click")}}, {{event("dblclick")}}, {{event("mouseup")}}, {{event("mousedown")}} があります。

+ +

MouseEvent は {{domxref("UIEvent")}} から派生しており、これはさらに {{domxref("Event")}} から派生しています。後方互換性のために {{domxref("MouseEvent.initMouseEvent()")}} メソッドは維持されていますが、 MouseEvent オブジェクトを作成する際は {{domxref("MouseEvent.MouseEvent", "MouseEvent()")}} コンストラクターを使用するべきです。

+ +

MouseEvent からは、 {{domxref("WheelEvent")}}, {{domxref("DragEvent")}} などの特定用途向けイベントが派生しています。

+ +

{{InheritanceDiagram}}

+ +

コンストラクター

+ +
+
{{domxref("MouseEvent.MouseEvent", "MouseEvent()")}}
+
MouseEvent オブジェクトを生成します。
+
+ +

プロパティ

+ +

このインターフェイスは、親インターフェイスである {{domxref("UIEvent")}} および {{domxref("Event")}} のプロパティも継承しています。

+ +
+
{{domxref("MouseEvent.altKey")}} {{readonlyinline}}
+
マウスイベントが発生したときに alt キーが押下されていれば、 true を返します。
+
{{domxref("MouseEvent.button")}} {{readonlyinline}}
+
マウスイベントが発生したときに押下されたボタンの番号 (もしあれば) です。
+
{{domxref("MouseEvent.buttons")}} {{readonlyinline}} {{gecko_minversion_inline("15.0")}}
+
マウスイベントが発生したときに離されていたボタンの番号 (もしあれば) です。
+
{{domxref("MouseEvent.clientX")}} {{readonlyinline}}
+
ローカル (DOM content) 座標における、マウスポインターの X 座標。
+
{{domxref("MouseEvent.clientY")}} {{readonlyinline}}
+
ローカル (DOM content) 座標における、マウスポインターの Y 座標。
+
{{domxref("MouseEvent.ctrlKey")}} {{readonlyinline}}
+
マウスイベントが発生したときに control キーが押下されていれば、 true を返します。
+
{{domxref("MouseEvent.metaKey")}} {{readonlyinline}}
+
マウスイベントが発生したときに meta キーが押下されていれば、 true を返します。
+
{{domxref("MouseEvent.movementX")}} {{readonlyinline}}
+
前の {{event("mousemove")}} イベントの位置に対して相対的な、マウスポインタの X 座標。
+
{{domxref("MouseEvent.movementY")}} {{readonlyinline}}
+
前の {{event("mousemove")}} イベントの位置に対して相対的な、マウスポインタの Y 座標。
+
{{domxref("MouseEvent.offsetX")}} {{readonlyinline}}{{experimental_inline}}
+
対象ノードのパディング境界の位置に対して相対的な、マウスポインタの X 座標。
+
{{domxref("MouseEvent.offsetY")}} {{readonlyinline}}{{experimental_inline}}
+
対象ノードのパディング境界の位置に対して相対的な、マウスポインタの Y 座標。
+
{{domxref("MouseEvent.pageX")}} {{readonlyinline}}{{experimental_inline}}
+
ドキュメント全体に対して相対的な、マウスポインタの X 座標。
+
{{domxref("MouseEvent.pageY")}} {{readonlyinline}}{{experimental_inline}}
+
ドキュメント全体に対して相対的な、マウスポインタの Y 座標。
+
{{domxref("MouseEvent.region")}} {{readonlyinline}}
+
イベントの影響を受けたヒット領域の ID を返します。影響を受けたヒット領域がない場合は、null を返します。
+
{{domxref("MouseEvent.relatedTarget")}} {{readonlyinline}}
+
イベントのセカンダリターゲットがあれば、それを表します。
+
{{domxref("MouseEvent.screenX")}} {{readonlyinline}}
+
グローバル (スクリーン) 座標における、マウスポインタの X 座標。
+
{{domxref("MouseEvent.screenY")}} {{readonlyinline}}
+
グローバル (スクリーン) 座標における、マウスポインタの Y 座標。
+
{{domxref("MouseEvent.shiftKey")}} {{readonlyinline}}
+
マウスイベントが発生したときに shift キーが押下されていれば、true を返します。
+
{{domxref("MouseEvent.which")}} {{non-standard_inline}} {{readonlyinline}}
+
マウスイベントが発生したときに押下されていたボタン。
+
{{domxref("MouseEvent.mozPressure")}} {{non-standard_inline()}} {{deprecated_inline}} {{readonlyinline}}
+
イベントが生成されたとき、タッチデバイスやタブレットデバイスに与えられた圧力の大きさです。この値の範囲は、0.0 (最小圧力) から 1.0 (最大圧力) の間です。このプロパティは非推奨 (または非標準) なので、代わりに {{domxref("PointerEvent")}} を使用し、 {{domxref("PointerEvent.pressure", "pressure")}} プロパティを見てください。
+
{{domxref("MouseEvent.mozInputSource")}} {{non-standard_inline()}} {{readonlyinline}}
+
イベントを生成したデバイスの種類 (MOZ_SOURCE_* 定数のいずれか)。これにより、例えばマウスイベントが実際のマウスによって発生したのか、あるいはタッチイベントによって発生したのかを識別できます (これは、イベントに関連する座標を解釈する際の正確さに影響を与えるでしょう)。
+
{{domxref("MouseEvent.webkitForce")}} {{non-standard_inline()}} {{readonlyinline}}
+
クリック時に与えられた圧力。
+
{{domxref("MouseEvent.x")}} {{experimental_inline}}{{readonlyinline}}
+
{{domxref("MouseEvent.clientX")}} の別名。
+
{{domxref("MouseEvent.y")}} {{experimental_inline}}{{readonlyinline}}
+
{{domxref("MouseEvent.clientY")}} の別名。
+
+ +

定数

+ +
+
{{domxref("MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN")}} {{non-standard_inline}}{{readonlyinline}}
+
通常のクリックに必要な最小圧力。
+
{{domxref("MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN")}} {{non-standard_inline}}{{readonlyinline}}
+
強めのクリック (force click)に必要な最小圧力。
+
+ +

メソッド

+ +

このインターフェイスは、親インターフェイスである {{domxref("UIEvent")}} および {{domxref("Event")}} のメソッドも継承します。

+ +
+
{{domxref("MouseEvent.getModifierState()")}}
+
指定した修飾キーの現在の状態を返します。詳しくは {{domxref("KeyboardEvent.getModifierState")}}() をご覧ください。
+
{{domxref("MouseEvent.initMouseEvent()")}} {{deprecated_inline}}
+
作成した MouseEvent の値を初期化します。イベントがすでにディスパッチされている場合は、何も行いません。
+
+ +

例

+ +

この例は、 DOM メソッドを使用してチェックボックスのクリックをシミュレーション (すなわち、プログラムで click イベントを生成) しています。

+ +

HTML

+ +
<p><label><input type="checkbox" id="checkbox"> Checked</label>
+<p><button id="button">Click me</button>
+ +

JavaScript

+ +
function simulateClick() {
+  var evt = new MouseEvent("click", {
+    bubbles: true,
+    cancelable: true,
+    view: window
+  });
+  var cb = document.getElementById("checkbox"); //element to click on
+  var canceled = !cb.dispatchEvent(evt);
+  if(canceled) {
+    // ハンドラで preventDefault を呼び出した場合
+    alert("canceled");
+  } else {
+    // ハンドラで preventDefault を呼び出さない場合
+    alert("not canceled");
+  }
+}
+document.getElementById("button").addEventListener('click', simulateClick);
+ +

結果

+ +

{{EmbedLiveSample('Example')}}

+ +

仕様書

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('CSSOM View','#extensions-to-the-mouseevent-interface', 'MouseEvent')}}{{Spec2('CSSOM View')}}MouseEvent を long から double へ再定義。すなわち PointerEvent の pointerType がマウスの場合、 double になります。
{{SpecName('Pointer Lock','#extensions-to-the-mouseevent-interface','MouseEvent')}}{{Spec2('Pointer Lock')}}{{SpecName('DOM3 Events')}} に movementX および movementY プロパティを追加。
{{SpecName('CSSOM View', '#extensions-to-the-mouseevent-interface', 'MouseEvent')}}{{Spec2('CSSOM View')}}{{SpecName('DOM3 Events')}} に offsetX, offsetY, pageX, pageY, x, y プロパティを追加。 screen, page, client, coordinate (x / y) プロパティを long から double へ変更。
{{SpecName('UI Events', '#interface-mouseevent', 'MouseEvent')}}{{Spec2('UI Events')}}
{{SpecName('DOM3 Events','#events-mouseevents','MouseEvent')}}{{Spec2('DOM3 Events')}}{{SpecName('DOM2 Events')}} に MouseEvent() コンストラクタ、getModifierState() メソッド、buttons プロパティを追加。
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent')}}{{Spec2('DOM2 Events')}}初回定義
+ +

ブラウザーの互換性

+ +

{{Compat("api.MouseEvent")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/mouseevent/mouseevent/index.html b/files/ja/web/api/mouseevent/mouseevent/index.html deleted file mode 100644 index ee410e9c65..0000000000 --- a/files/ja/web/api/mouseevent/mouseevent/index.html +++ /dev/null @@ -1,179 +0,0 @@ ---- -title: MouseEvent() -slug: Web/API/MouseEvent/MouseEvent -tags: - - API - - Constructor - - DOM - - MouseEvent - - Reference - - events -translation_of: Web/API/MouseEvent/MouseEvent ---- -

{{APIRef("DOM Events")}}

- -

MouseEvent() コンストラクタは、新しい {{domxref("MouseEvent")}} を作成します。

- -

シンタックス

- -
 event = new MouseEvent(typeArg, mouseEventInit);
- -

値

- -
-
typeArg
-
イベント名を表す {{domxref("DOMString")}} です。
-
mouseEventInit {{optional_inline}}
-
- -
-
Is a MouseEventInit dictionary, having the following fields: - -
    -
  • "screenX", optional and defaulting to 0, of type long, that is the horizontal position of the mouse event on the user's screen; setting this value doesn't move the mouse pointer.
    • -
  • "screenY", optional and defaulting to 0, of type long, that is the vertical position of the mouse event on the user's screen; setting this value doesn't move the mouse pointer.
    • -
  • "clientX", optional and defaulting to 0, of type long, that is the horizontal position of the mouse event on the client window of user's screen; setting this value doesn't move the mouse pointer.
    • -
  • "clientY", optional and defaulting to 0, of type long, that is the vertical position of the mouse event on the client window of the user's screen; setting this value doesn't move the mouse pointer.
    • -
  • "ctrlKey", optional and defaulting to false, of type {{jsxref("Boolean")}}, that indicates if the ctrl key was simultaneously pressed.
    • -
  • "shiftKey", optional and defaulting to false, of type {{jsxref("Boolean")}}, that indicates if the shift key was simultaneously pressed.
    • -
  • "altKey", optional and defaulting to false, of type {{jsxref("Boolean")}}, that indicates if the alt key was simultaneously pressed.
    • -
  • "metaKey", optional and defaulting to false, of type {{jsxref("Boolean")}}, that indicates if the meta key was simultaneously pressed.
    • -
  • "button", optional and defaulting to 0, of type short, that describes which button is pressed during events related to the press or release of a button: - - - - - - - - - - - - - - - - - - - - - -
    ValueMeaning
    0Main button pressed (usually the left button) or un-initialized
    1Auxiliary button pressed (usually the middle button)
    2Secondary button pressed (usually the right button)
    -
    • -
  • "buttons", optional and defaulting to 0, of type unsigned short, that describes which buttons are pressed when the event is launched: - - - - - - - - - - - - - - - - - - - - - - - - - -
    Bit-field valueMeaning
    0No button pressed
    1Main button pressed (usually the left button)
    2Secondary button pressed (usually the right button)
    4Auxiliary button pressed (usually the middle button)
    -
    • -
  • "relatedTarget", optional and defaulting to null, of type {{domxref("EventTarget")}}, that is the element just left (in case of  a {{event("mouseenter")}} or {{event("mouseover")}}) or is entering (in case of a {{event("mouseout")}} or {{event("mouseleave")}}).
    • -
  • "region", optional and defaulting to null, of type {{domxref("DOMString")}}, is the id of the hit region affected by the event. The absence of any hit region is affected, is represented by the null value.
    • -
- -

実装によっては、スクリーンとクライアントのフィールドに数値以外のものを渡すと TypeError がスローされます。

- -
-

MouseEventInit ディクショナリは、{{domxref("UIEvent.UIEvent", "UIEventInit")}} や {{domxref("Event.Event", "EventInit")}} ディクショナリのフィールドも受け入れます。

-
-
-
- -

仕様

- - - - - - - - - - - - - - - - - - - - - -
仕様書ステータスコメント
{{SpecName('CSSOM View', '#extensions-to-the-mouseevent-interface', 'MouseEvent')}}{{Spec2('CSSOM View')}}画面とクライアントのフィールド long を double に再定義しました。
{{SpecName('DOM3 Events','#interface-MouseEvent','MouseEvent()')}}{{Spec2('DOM3 Events')}}初期定義
- -

ブラウザの互換性

- -

{{Compat("api.MouseEvent.MouseEvent")}}

- -

ポリフィル

- -

Internet Explorer 9 以降の MouseEvent() コンストラクタ機能は、以下のコードでポリフィルすることができます。

- -
(function (window) {
-  try {
-    new MouseEvent('test');
-    return false; // ポリフィル不要
-  } catch (e) {
-		// ポリフィルの必要性 - 落下
-  }
-
-    // ポリフィル DOM4 MouseEvent
-	var MouseEventPolyfill = function (eventType, params) {
-		params = params || { bubbles: false, cancelable: false };
-		var mouseEvent = document.createEvent('MouseEvent');
-		mouseEvent.initMouseEvent(eventType,
-			params.bubbles,
-			params.cancelable,
-			window,
-			0,
-			params.screenX || 0,
-			params.screenY || 0,
-			params.clientX || 0,
-			params.clientY || 0,
-			params.ctrlKey || false,
-			params.altKey || false,
-			params.shiftKey || false,
-			params.metaKey || false,
-			params.button || 0,
-			params.relatedTarget || null
-		);
-
-		return mouseEvent;
-	}
-
-	MouseEventPolyfill.prototype = Event.prototype;
-
-	window.MouseEvent = MouseEventPolyfill;
-})(window);
-
- -

あわせて参照

- - diff --git a/files/ja/web/api/mouseevent/mouseevent/index.md b/files/ja/web/api/mouseevent/mouseevent/index.md new file mode 100644 index 0000000000..ee410e9c65 --- /dev/null +++ b/files/ja/web/api/mouseevent/mouseevent/index.md @@ -0,0 +1,179 @@ +--- +title: MouseEvent() +slug: Web/API/MouseEvent/MouseEvent +tags: + - API + - Constructor + - DOM + - MouseEvent + - Reference + - events +translation_of: Web/API/MouseEvent/MouseEvent +--- +

{{APIRef("DOM Events")}}

+ +

MouseEvent() コンストラクタは、新しい {{domxref("MouseEvent")}} を作成します。

+ +

シンタックス

+ +
 event = new MouseEvent(typeArg, mouseEventInit);
+ +

値

+ +
+
typeArg
+
イベント名を表す {{domxref("DOMString")}} です。
+
mouseEventInit {{optional_inline}}
+
+ +
+
Is a MouseEventInit dictionary, having the following fields: + +
    +
  • "screenX", optional and defaulting to 0, of type long, that is the horizontal position of the mouse event on the user's screen; setting this value doesn't move the mouse pointer.
    • +
  • "screenY", optional and defaulting to 0, of type long, that is the vertical position of the mouse event on the user's screen; setting this value doesn't move the mouse pointer.
    • +
  • "clientX", optional and defaulting to 0, of type long, that is the horizontal position of the mouse event on the client window of user's screen; setting this value doesn't move the mouse pointer.
    • +
  • "clientY", optional and defaulting to 0, of type long, that is the vertical position of the mouse event on the client window of the user's screen; setting this value doesn't move the mouse pointer.
    • +
  • "ctrlKey", optional and defaulting to false, of type {{jsxref("Boolean")}}, that indicates if the ctrl key was simultaneously pressed.
    • +
  • "shiftKey", optional and defaulting to false, of type {{jsxref("Boolean")}}, that indicates if the shift key was simultaneously pressed.
    • +
  • "altKey", optional and defaulting to false, of type {{jsxref("Boolean")}}, that indicates if the alt key was simultaneously pressed.
    • +
  • "metaKey", optional and defaulting to false, of type {{jsxref("Boolean")}}, that indicates if the meta key was simultaneously pressed.
    • +
  • "button", optional and defaulting to 0, of type short, that describes which button is pressed during events related to the press or release of a button: + + + + + + + + + + + + + + + + + + + + + +
    ValueMeaning
    0Main button pressed (usually the left button) or un-initialized
    1Auxiliary button pressed (usually the middle button)
    2Secondary button pressed (usually the right button)
    +
    • +
  • "buttons", optional and defaulting to 0, of type unsigned short, that describes which buttons are pressed when the event is launched: + + + + + + + + + + + + + + + + + + + + + + + + + +
    Bit-field valueMeaning
    0No button pressed
    1Main button pressed (usually the left button)
    2Secondary button pressed (usually the right button)
    4Auxiliary button pressed (usually the middle button)
    +
    • +
  • "relatedTarget", optional and defaulting to null, of type {{domxref("EventTarget")}}, that is the element just left (in case of  a {{event("mouseenter")}} or {{event("mouseover")}}) or is entering (in case of a {{event("mouseout")}} or {{event("mouseleave")}}).
    • +
  • "region", optional and defaulting to null, of type {{domxref("DOMString")}}, is the id of the hit region affected by the event. The absence of any hit region is affected, is represented by the null value.
    • +
+ +

実装によっては、スクリーンとクライアントのフィールドに数値以外のものを渡すと TypeError がスローされます。

+ +
+

MouseEventInit ディクショナリは、{{domxref("UIEvent.UIEvent", "UIEventInit")}} や {{domxref("Event.Event", "EventInit")}} ディクショナリのフィールドも受け入れます。

+
+
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + + + +
仕様書ステータスコメント
{{SpecName('CSSOM View', '#extensions-to-the-mouseevent-interface', 'MouseEvent')}}{{Spec2('CSSOM View')}}画面とクライアントのフィールド long を double に再定義しました。
{{SpecName('DOM3 Events','#interface-MouseEvent','MouseEvent()')}}{{Spec2('DOM3 Events')}}初期定義
+ +

ブラウザの互換性

+ +

{{Compat("api.MouseEvent.MouseEvent")}}

+ +

ポリフィル

+ +

Internet Explorer 9 以降の MouseEvent() コンストラクタ機能は、以下のコードでポリフィルすることができます。

+ +
(function (window) {
+  try {
+    new MouseEvent('test');
+    return false; // ポリフィル不要
+  } catch (e) {
+		// ポリフィルの必要性 - 落下
+  }
+
+    // ポリフィル DOM4 MouseEvent
+	var MouseEventPolyfill = function (eventType, params) {
+		params = params || { bubbles: false, cancelable: false };
+		var mouseEvent = document.createEvent('MouseEvent');
+		mouseEvent.initMouseEvent(eventType,
+			params.bubbles,
+			params.cancelable,
+			window,
+			0,
+			params.screenX || 0,
+			params.screenY || 0,
+			params.clientX || 0,
+			params.clientY || 0,
+			params.ctrlKey || false,
+			params.altKey || false,
+			params.shiftKey || false,
+			params.metaKey || false,
+			params.button || 0,
+			params.relatedTarget || null
+		);
+
+		return mouseEvent;
+	}
+
+	MouseEventPolyfill.prototype = Event.prototype;
+
+	window.MouseEvent = MouseEventPolyfill;
+})(window);
+
+ +

あわせて参照

+ + diff --git a/files/ja/web/api/mouseevent/screenx/index.html b/files/ja/web/api/mouseevent/screenx/index.html deleted file mode 100644 index 74d090a292..0000000000 --- a/files/ja/web/api/mouseevent/screenx/index.html +++ /dev/null @@ -1,84 +0,0 @@ ---- -title: MouseEvent.screenX -slug: Web/API/MouseEvent/screenX -translation_of: Web/API/MouseEvent/screenX ---- -

{{APIRef("DOM Events")}}

- -

MouseEvent.screenX は、イベントの発生した位置の、スクリーン内での X 座標を参照できる読み取り専用の属性です。

- -

記法

- -
var pixelNumber = instanceOfMouseEvent.screenX
-
- -

返り値

- - - -

使用例

- -
<html>
-<head>
-<title>screenX\screenY example</title>
-
-<script type="text/javascript">
-
-function showCoords(evt){
-  alert(
-    "screenX value: " + evt.screenX + "\n"
-    + "screenY value: " + evt.screenY + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onmousedown="showCoords(event)">
-<p>To display the mouse coordinates click anywhere on the page.</p>
-</body>
-</html>
-
- -

window や document のような領域の広い要素に対してイベントを処理する場合、以下のように座標を元に適切な処理を呼び出すことができます。

- -
function checkClickMap(e) {
-  if (e.screenX < 50) doRedButton();
-  if (50 <= e.screenX && e.screenX < 100) doYellowButton();
-  if (e.screenX >= 100) doRedButton();
-}
-
- -

仕様

- - - - - - - - - - - - - - - - - - - -
仕様状態コメント
{{SpecName('DOM3 Events','#widl-MouseEvent-screenX','MouseEvent.screenX')}}{{Spec2('DOM3 Events')}} {{SpecName('DOM2 Events')}} からの変更なし
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.sceenX')}}{{Spec2('DOM2 Events')}}最初の定義
- -

ブラウザ互換性

- -

{{Compat("api.MouseEvent.screenX")}}

- -

関連情報

- - diff --git a/files/ja/web/api/mouseevent/screenx/index.md b/files/ja/web/api/mouseevent/screenx/index.md new file mode 100644 index 0000000000..74d090a292 --- /dev/null +++ b/files/ja/web/api/mouseevent/screenx/index.md @@ -0,0 +1,84 @@ +--- +title: MouseEvent.screenX +slug: Web/API/MouseEvent/screenX +translation_of: Web/API/MouseEvent/screenX +--- +

{{APIRef("DOM Events")}}

+ +

MouseEvent.screenX は、イベントの発生した位置の、スクリーン内での X 座標を参照できる読み取り専用の属性です。

+ +

記法

+ +
var pixelNumber = instanceOfMouseEvent.screenX
+
+ +

返り値

+ + + +

使用例

+ +
<html>
+<head>
+<title>screenX\screenY example</title>
+
+<script type="text/javascript">
+
+function showCoords(evt){
+  alert(
+    "screenX value: " + evt.screenX + "\n"
+    + "screenY value: " + evt.screenY + "\n"
+  );
+}
+
+</script>
+</head>
+
+<body onmousedown="showCoords(event)">
+<p>To display the mouse coordinates click anywhere on the page.</p>
+</body>
+</html>
+
+ +

window や document のような領域の広い要素に対してイベントを処理する場合、以下のように座標を元に適切な処理を呼び出すことができます。

+ +
function checkClickMap(e) {
+  if (e.screenX < 50) doRedButton();
+  if (50 <= e.screenX && e.screenX < 100) doYellowButton();
+  if (e.screenX >= 100) doRedButton();
+}
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('DOM3 Events','#widl-MouseEvent-screenX','MouseEvent.screenX')}}{{Spec2('DOM3 Events')}} {{SpecName('DOM2 Events')}} からの変更なし
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.sceenX')}}{{Spec2('DOM2 Events')}}最初の定義
+ +

ブラウザ互換性

+ +

{{Compat("api.MouseEvent.screenX")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/mouseevent/shiftkey/index.html b/files/ja/web/api/mouseevent/shiftkey/index.html deleted file mode 100644 index 8e97c700ed..0000000000 --- a/files/ja/web/api/mouseevent/shiftkey/index.html +++ /dev/null @@ -1,76 +0,0 @@ ---- -title: MouseEvent.shiftKey -slug: Web/API/MouseEvent/shiftKey -translation_of: Web/API/MouseEvent/shiftKey ---- -

{{APIRef("DOM Events")}}

- -

MouseEvent.shiftKeyは読み取り専用のプロパティです。  shift キーが押された (true) か離されている (false) かを各イベント時に表します。

- -

文法

- -
var shiftKeyPressed = instanceOfMouseEvent.shiftKey
-
- -

返り値

- -

A boolean

- -

使用例

- -
<html>
-<head>
-<title>shiftKey example</title>
-
-<script type="text/javascript">
-
-function showChar(e){
-  alert(
-    "Key Pressed: " + String.fromCharCode(e.charCode) + "\n"
-    + "charCode: " + e.charCode + "\n"
-    + "SHIFT key pressed: " + e.shiftKey + "\n"
-    + "ALT key pressed: " + e.altKey + "\n"
-  );
-}
-
-</script>
-</head>
-
-<body onkeypress="showChar(event);">
-<p>シフトキーを押しながらアルファベットキーを押してみてください。<br />
-同様に Altキーとも同時に使うことができます。</p>
-</body>
-</html>
-
- -

仕様

- - - - - - - - - - - - - - - - - - - -
仕様ステータス注釈
{{SpecName('DOM3 Events','#widl-MouseEvent-shiftKey','MouseEvent.shiftKey')}}{{Spec2('DOM3 Events')}}次から変更なし{{SpecName('DOM2 Events')}}.
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.shiftKey')}}{{Spec2('DOM2 Events')}}初期の定義
- -

ブラウザの互換性

- -

{{Compat("api.MouseEvent.shiftKey")}}

- -

参考

- - diff --git a/files/ja/web/api/mouseevent/shiftkey/index.md b/files/ja/web/api/mouseevent/shiftkey/index.md new file mode 100644 index 0000000000..8e97c700ed --- /dev/null +++ b/files/ja/web/api/mouseevent/shiftkey/index.md @@ -0,0 +1,76 @@ +--- +title: MouseEvent.shiftKey +slug: Web/API/MouseEvent/shiftKey +translation_of: Web/API/MouseEvent/shiftKey +--- +

{{APIRef("DOM Events")}}

+ +

MouseEvent.shiftKeyは読み取り専用のプロパティです。  shift キーが押された (true) か離されている (false) かを各イベント時に表します。

+ +

文法

+ +
var shiftKeyPressed = instanceOfMouseEvent.shiftKey
+
+ +

返り値

+ +

A boolean

+ +

使用例

+ +
<html>
+<head>
+<title>shiftKey example</title>
+
+<script type="text/javascript">
+
+function showChar(e){
+  alert(
+    "Key Pressed: " + String.fromCharCode(e.charCode) + "\n"
+    + "charCode: " + e.charCode + "\n"
+    + "SHIFT key pressed: " + e.shiftKey + "\n"
+    + "ALT key pressed: " + e.altKey + "\n"
+  );
+}
+
+</script>
+</head>
+
+<body onkeypress="showChar(event);">
+<p>シフトキーを押しながらアルファベットキーを押してみてください。<br />
+同様に Altキーとも同時に使うことができます。</p>
+</body>
+</html>
+
+ +

仕様

+ + + + + + + + + + + + + + + + + + + +
仕様ステータス注釈
{{SpecName('DOM3 Events','#widl-MouseEvent-shiftKey','MouseEvent.shiftKey')}}{{Spec2('DOM3 Events')}}次から変更なし{{SpecName('DOM2 Events')}}.
{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.shiftKey')}}{{Spec2('DOM2 Events')}}初期の定義
+ +

ブラウザの互換性

+ +

{{Compat("api.MouseEvent.shiftKey")}}

+ +

参考

+ + -- cgit v1.2.3-54-g00ecf