diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
commit | 074785cea106179cb3305637055ab0a009ca74f2 (patch) | |
tree | e6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/ru/web/api/mouseevent | |
parent | da78a9e329e272dedb2400b79a3bdeebff387d47 (diff) | |
download | translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2 translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip |
initial commit
Diffstat (limited to 'files/ru/web/api/mouseevent')
-rw-r--r-- | files/ru/web/api/mouseevent/button/index.html | 152 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/buttons/index.html | 125 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/clientx/index.html | 132 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/clienty/index.html | 124 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/ctrlkey/index.html | 71 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/index.html | 303 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/offsetx/index.html | 122 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/pagex/index.html | 124 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/screenx/index.html | 93 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/shiftkey/index.html | 126 | ||||
-rw-r--r-- | files/ru/web/api/mouseevent/which/index.html | 47 |
11 files changed, 1419 insertions, 0 deletions
diff --git a/files/ru/web/api/mouseevent/button/index.html b/files/ru/web/api/mouseevent/button/index.html new file mode 100644 index 0000000000..a5bd49e4b9 --- /dev/null +++ b/files/ru/web/api/mouseevent/button/index.html @@ -0,0 +1,152 @@ +--- +title: MouseEvent.button +slug: Web/API/MouseEvent/button +translation_of: Web/API/MouseEvent/button +--- +<p>{{APIRef("DOM Events")}}</p> + +<p><strong><code>MouseEvent.button</code></strong> свойство доступное только для чтения, возвращает значение, соответствующее нажатой кнопки мыши, которое инициировало событие.</p> + +<p>Это свойство предоставляет информацию только о том, какая кнопка или несколько кнопок были нажаты или отпущены для инициации события, и не имеет отношения к таким событиям как {{event("mouseenter")}}, {{event("mouseleave")}}, {{event("mouseover")}}, {{event("mouseout")}} или {{event("mousemove")}}.</p> + +<p>Пользователь может изменять конфигурацию кнопок своей мыши таким образом, что значение ноль будет получено при нажатии кнопки, не являющейся физически крайней левой кнопкой мыши, тем не менее, событие будет вести себя так, как будто левая кнопка была нажата в стандартной раскладкой кнопок.</p> + +<div class="note"> +<p><strong>Примечание:</strong> Не путайте это свойство со свойством {{domxref ( "MouseEvent.buttons")}}, которое содержит значения, соответствующие нажатым кнопкам мыши для всех типов событий мыши.</p> +</div> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox notranslate">var <em>buttonPressed</em> = <em>instanceOfMouseEvent</em>.button +</pre> + +<h3 id="Возвращаемые_значения">Возвращаемые значения</h3> + +<p>Число, соответстующее нажатой кнопке:</p> + +<ul> + <li><code>0</code>: Нажата основная кнопка. Левая кнопка мыши или переназначенная пользователем другая кнопка</li> + <li><code>1</code>: Нажата вспомогательная кнопка. Колёсико или средняя кнопка мыши, если она есть</li> + <li><code>2</code>: Нажата вторичная кнопка. Правая кнопка мыши</li> + <li><code>3</code>: Нажата четвёртая кнопка мыши. Обычно кнопка браузера <em>Назад</em></li> + <li><code>4</code>: Нажата пятая кнопка мыши. Обычно кнопка браузера <em>Вперёд</em></li> +</ul> + +<p>Для мыши, перенастроенной под левую руку, значения нажатых кнопок меняются местами. В этом случае значения читаются справа налево.</p> + +<h2 id="Пример">Пример</h2> + +<pre class="brush: js notranslate"><script> +var whichButton = function (e) { + // Handle different event models + var e = e || window.event; + var btnCode; + + if ('object' === typeof e) { + btnCode = e.button; + + switch (btnCode) { + case 0: + console.log('Нажата левая кнопка.'); + break; + + case 1: + console.log('Нажата средняя кнопка или колёсико.'); + break; + + case 2: + console.log('Нажата правая кнопка.'); + break; + + default: + console.log('Неопределённое событие: ' + btnCode); + } + } +} +</script> + +<button onmouseup="whichButton(event);" oncontextmenu="event.preventDefault();">Нажмите кнопку мыши...</button></pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#widl-MouseEvent-button','MouseEvent.button')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Compared to {{SpecName('DOM2 Events')}}, the return value can be negative.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.button')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Поддерживается_браузерами">Поддерживается браузерами</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop(1)}}</td> + <td>1.0</td> + <td>9.0 [1]</td> + <td>{{CompatVersionUnknown}}</td> + <td>3.0.4</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>Android</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Это соглашение не поддерживается браузерами Internet Explorer до версии 9: см. <a href="http://www.quirksmode.org/js/events_properties.html#button">QuirksMode for details</a>.</p> + +<h2 id="Смотри_также">Смотри также</h2> + +<ul> + <li>{{domxref('"MouseEvent"')}}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/buttons/index.html b/files/ru/web/api/mouseevent/buttons/index.html new file mode 100644 index 0000000000..76a76cfbb4 --- /dev/null +++ b/files/ru/web/api/mouseevent/buttons/index.html @@ -0,0 +1,125 @@ +--- +title: MouseEvent.buttons +slug: Web/API/MouseEvent/buttons +translation_of: Web/API/MouseEvent/buttons +--- +<div>{{APIRef("DOM Events")}}</div> + +<div>Свойство<span class="seoSummary"><strong><code>MouseEvent.buttons</code></strong></span>доступно только для чтения. Оно показывает, какие клавиши мыши (или другого устройства ввода) были нажаты при срабатывании события.</div> + +<div> </div> + +<div>Для каждой нажатой кнопки есть своё уникальное битовое значение (см. ниже раздел "<a href="#Return">Возвращаемые значения</a>"). Если нажаты несколько кнопок одновременно, значения суммируются, создавая новое значение. Например, если нажата вторая кнопка (2 или 000010 в двоичном коде) вместе со средней (4 или 000100 в двоичном коде), значение будет равно 6 (2 + 4) или 000110 в двоичном коде.</div> + +<div> </div> + +<div class="note"> +<p><strong>Note:</strong> Не путайте это свойство со свойством {{domxref("MouseEvent.button")}}. Текущее свойство {{domxref("MouseEvent.buttons")}} показывает состояние нажатых кнопок при любом событии мыши, а свойство {{domxref("MouseEvent.button")}} указывает на события, произошедшие в результате нажатия/отпускания кнопок мыши.</p> +</div> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox">var <em>buttonPressed</em> = <em>instanceOfMouseEvent</em>.buttons +</pre> + +<h2 id="Возвращаемые_значения"><a id="Return" name="Return">Возвращаемые значения</a></h2> + +<p>Целое число, представляющее одну или несколько кнопок. При одновременном нажатии нескольких кнопок значения объединяются (например, 3 = первая (1) + вторая (2) кнопки мыши):</p> + +<ul> + <li><code>0 </code> : кнопки не нажаты или не инициализированы;</li> + <li><code>1 </code> : первая кнопка (обычно левая);</li> + <li><code>2 </code> : вторая кнопка (обычно правая);</li> + <li><code>4 </code> : дополнительная кнопка (обычно средняя или колёсико мыши);</li> + <li><code>8 </code> : четвёртая кнопка (как правило, кнопка "Назад" браузера);</li> + <li><code>16</code> : пятая кнопка (как правило, кнопка "Вперёд" браузера).</li> +</ul> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#widl-MouseEvent-buttons','MouseEvent.buttons')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome(43)}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}<sup>[1]</sup></td> + <td>9</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android Webview</th> + <th>Chrome for Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Gecko supports the <code>buttons</code> attribute on Windows, Linux (GTK), and Mac OS with the following restrictions:</p> + +<ul> + <li>Utilities allow customization of button actions so that primary may not the the left button on the device, secondary may not be the right button, and so on. The middle (wheel) button, 4th button and 5th button might not be assigned a value, even when they are pressed.</li> + <li>Single button devices may emulate additional buttons with combinations of button and keyboard presses</li> + <li>Touch devices may emulate buttons with configurable gestures (e.g. single touch for primary, two-finger touch for secondary, etc.)</li> + <li>On Linux (GTK), the 4th button and the 5th button are not supported. In addition, a mouseup event always has the releasing button information in this attribute value.</li> + <li>On Mac OS X 10.5, the buttons attribute always returns 0 because there is no platform API for implementing this feature.</li> +</ul> + +<h2 id="Смотри_также">Смотри также</h2> + +<ul> + <li>{{domxref("MouseEvent")}}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/clientx/index.html b/files/ru/web/api/mouseevent/clientx/index.html new file mode 100644 index 0000000000..2122a975a2 --- /dev/null +++ b/files/ru/web/api/mouseevent/clientx/index.html @@ -0,0 +1,132 @@ +--- +title: MouseEvent.clientX +slug: Web/API/MouseEvent/clientX +tags: + - API + - CSSOM View + - DOM + - DOM Events + - MouseEvent + - Property + - Read-only +translation_of: Web/API/MouseEvent/clientX +--- +<p>{{APIRef("DOM Events")}}</p> + +<p><strong><code>MouseEvent.clientX</code></strong> свойство доступное только для чтения. Это свойство является горизонтальной координатой в пределах клиентской области приложения, на которой произошло событие (в отличие от координат внутри страницы). Для примера, нажатие в верхнем левом углу клиентской области будет всегда приводить к событию со значением свойства <code>clientX </code>равным 0, независимо от того, прокручена страницы по горизонтали или нет.</p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox">var <em>x</em> = <em>instanceOfMouseEvent</em>.clientX +</pre> + +<h3 id="Возвращаемое_значение">Возвращаемое значение</h3> + +<p>Числовое значение горизонтальной координаты</p> + +<h2 id="Example" name="Example">Пример</h2> + +<pre class="brush:html"><!DOCTYPE html> +<html> +<head> +<title>Пример для clientX\clientY</title> + +<script> +function showCoords(evt){ + alert( + "clientX value: " + evt.clientX + "\n" + + "clientY value: " + evt.clientY + "\n" + ); +} +</script> +</head> + +<body onmousedown="showCoords(event)"> +<p>Для показа координат мышки нажмите в любом месте страницы.</p> +</body> +</html> +</pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#widl-MouseEvent-clientX','MouseEvent.clientX')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Нет отличий от {{SpecName('DOM2 Events')}}.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.clientX')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Изначальное определение.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>6</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>Android</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also"><strong>Смотрите также</strong></h2> + +<ul> + <li>{{ domxref("MouseEvent") }}</li> + <li>{{domxref("MouseEvent.clientY","clientY")}}</li> + <li>{{domxref("MouseEvent.screenX","screenX")}} / {{domxref("MouseEvent.screenY","screenY")}}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/clienty/index.html b/files/ru/web/api/mouseevent/clienty/index.html new file mode 100644 index 0000000000..02d03fb891 --- /dev/null +++ b/files/ru/web/api/mouseevent/clienty/index.html @@ -0,0 +1,124 @@ +--- +title: MouseEvent.clientY +slug: Web/API/MouseEvent/clientY +translation_of: Web/API/MouseEvent/clientY +--- +<p>{{APIRef("DOM Events")}}</p> + +<p><strong><code>MouseEvent.clientY</code></strong> свойство доступное только для чтения. Это свойство является вертикальной координатой в пределах клиентской области приложения, на которой произошло событие (в отличие от координат внутри страницы). Для примера, нажатие в верхнем левом углу клиентской области будет всегда приводить к событию со значением свойства <code>clientY </code>равным 0, независимо от того, прокручена страницы по вертикали или нет.</p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox">var <em>y</em> = <em>instanceOfMouseEvent</em>.clientY +</pre> + +<h3 id="Возвращаемое_значение">Возвращаемое значение</h3> + +<p>Числовое значение вертикальной координаты</p> + +<h2 id="Example" name="Example">Example</h2> + +<pre class="brush:html"><!DOCTYPE html> +<html> +<head> +<title>Пример для clientX\clientY</title> + +<script> +function showCoords(evt){ + alert( + "clientX value: " + evt.clientX + "\n" + + "clientY value: " + evt.clientY + "\n" + ); +} +</script> +</head> + +<body onmousedown="showCoords(event)"> +<p>Для показа координат мышки нажмите в любом месте страницы.</p> +</body> +</html> +</pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#widl-MouseEvent-clientY','MouseEvent.clientY')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Нет отличий от {{SpecName('DOM2 Events')}}.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.clientY')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Изначальное определение.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>6</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>Android</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also"><strong>Смотрите также</strong></h2> + +<ul> + <li>{{ domxref("MouseEvent") }}</li> + <li>{{domxref("MouseEvent.clientX","clientX")}}</li> + <li>{{domxref("MouseEvent.screenX","screenX")}} / {{domxref("MouseEvent.screenY","screenY")}}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/ctrlkey/index.html b/files/ru/web/api/mouseevent/ctrlkey/index.html new file mode 100644 index 0000000000..6b8815d8da --- /dev/null +++ b/files/ru/web/api/mouseevent/ctrlkey/index.html @@ -0,0 +1,71 @@ +--- +title: MouseEvent.ctrlKey +slug: Web/API/MouseEvent/ctrlKey +translation_of: Web/API/MouseEvent/ctrlKey +--- +<p>{{APIRef("DOM Events")}}</p> + +<p>Свойство только для чтения <strong><code>MouseEvent.ctrlKey</code></strong> возращает true, когда клавиша Ctrl была нажата, а если нет - false.</p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox">var <em>ctrlKeyPressed</em> = <em>instanceOfMouseEvent</em>.ctrlKey +</pre> + +<h3 id="Возвращаемое_значение">Возвращаемое значение</h3> + +<p>Boolean</p> + +<h2 id="Example" name="Example">Пример</h2> + +<pre class="brush: js"><html> +<head> +<title>Пример с ctrlKey</title> + +<script type="text/javascript"> +document.addEventListener('click', function(e) { + console.log('Нажата клавиша Ctrl?', e.ctrlKey); +}) +</script> +</head> + +<body> +<p> +Кликните в любое место на странице и откройте консоль разработчика, чтобы узнать - нажата ли клавиша Ctrl? +</p> +</body> +</html></pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#widl-MouseEvent-ctrlKey','MouseEvent.ctrlKey')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Нет различий от {{SpecName('DOM2 Events')}}.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.ctrlKey')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Поддержка браузеров</h2> + + + +<p>{{Compat("api.MouseEvent.ctrlKey")}}</p> + +<h2 id="See_also" name="See_also">Смотрите также</h2> + +<ul> + <li>{{ domxref("MouseEvent") }}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/index.html b/files/ru/web/api/mouseevent/index.html new file mode 100644 index 0000000000..610f8aacef --- /dev/null +++ b/files/ru/web/api/mouseevent/index.html @@ -0,0 +1,303 @@ +--- +title: MouseEvent +slug: Web/API/MouseEvent +tags: + - API + - DOM + - DOM Events + - Interface + - NeedsTranslation + - Reference +translation_of: Web/API/MouseEvent +--- +<p id="Summary">{{APIRef("DOM Events")}}</p> + +<p>Интерфейс <code><strong>MouseEvent</strong></code> представляет собой событие, которое происходит в результате взаимодествия пользователя с манипулятором ( например, мышью). Наиболее частые из таких событий: {{event("click")}}, {{event("dblclick")}}, {{event("mouseup")}}, {{event("mousedown")}}.</p> + +<p><code>MouseEvent</code> выводится из метода {{domxref("UIEvent")}}, который в свою очередь происходит из метода {{domxref("Event")}}. Метод {{domxref("MouseEvent.initMouseEvent()")}} допустимо использовать для лучшей совместимости с предыдущими версиями, однако, для создания <code>MouseEvent </code>рекомендуется использовать конструктор метода {{domxref("MouseEvent.MouseEvent", "MouseEvent()")}}.</p> + +<p>Несколько более конкретные события, производные от события mouseevent: {{domxref("WheelEvent")}} and {{domxref("DragEvent")}}.</p> + +<h2 id="Конструктор">Конструктор</h2> + +<dl> + <dt>{{domxref("MouseEvent.MouseEvent", "MouseEvent()")}}</dt> + <dd>Создает объект <code>MouseEvent</code>.</dd> +</dl> + +<h2 id="Свойства">Свойства</h2> + +<p><em>Данный интерфес наследует свойства от родителей {{domxref("UIEvent")}} и {{domxref("Event")}}.</em></p> + +<dl> + <dt>{{domxref("MouseEvent.altKey")}} {{readonlyinline}}</dt> + <dd>Возвращает значение <code>true,</code> если клавиша <kbd>alt</kbd> была нажата во время движения мыши.</dd> + <dt>{{domxref("MouseEvent.button")}} {{readonlyinline}}</dt> + <dd>Представляет код клавиши, нажатой в то время, когда произошло событие мыши.</dd> + <dt>{{domxref("MouseEvent.buttons")}} {{readonlyinline}} {{gecko_minversion_inline("15.0")}}</dt> + <dd> + <p>Отображает, какие клавиши были нажаты во время движения мыши.</p> + </dd> + <dt>{{domxref("MouseEvent.clientX")}} {{readonlyinline}}</dt> + <dd>Отображение X координат курсора мыши в локальной системе координат (DOM контент).</dd> + <dt>{{domxref("MouseEvent.clientY")}} {{readonlyinline}}</dt> + <dd>Отображение Y координат курсора мыши в локальной системе координат (DOM контент).</dd> + <dt>{{domxref("MouseEvent.ctrlKey")}} {{readonlyinline}}</dt> + <dd>Возвращает значение <code>true,</code> если клавиша <kbd>control</kbd> была нажата во время движения мыши.</dd> + <dt>{{domxref("MouseEvent.metaKey")}} {{readonlyinline}}</dt> + <dd>Возвращает значение <code>true,</code> если клавиша <kbd>meta</kbd> была нажата во время движения мыши.</dd> + <dt>{{domxref("MouseEvent.movementX")}} {{readonlyinline}}</dt> + <dd>Отображает X координат указателя мыши относительно позиции последнего {{event("mousemove")}} события.</dd> + <dt>{{domxref("MouseEvent.movementY")}} {{readonlyinline}}</dt> + <dd>Отображает Y координат указателя мыши относительно позиции последнего {{event("mousemove")}} события.</dd> + <dt>{{domxref("MouseEvent.offsetX")}} {{readonlyinline}}{{experimental_inline}}</dt> + <dd>Отображает X координат указателя мыши относительно позиции границы отступа целевого узла.</dd> + <dt>{{domxref("MouseEvent.offsetY")}} {{readonlyinline}}{{experimental_inline}}</dt> + <dd>Отображает Y координат указателя мыши относительно позиции границы отступа целевого узла.</dd> + <dt>{{domxref("MouseEvent.pageX")}} {{readonlyinline}}{{experimental_inline}}</dt> + <dd>Отображает X координат указателя мыши относительно всего документа.</dd> + <dt>{{domxref("MouseEvent.pageY")}} {{readonlyinline}}{{experimental_inline}}</dt> + <dd>Отображает Y координат указателя мыши относительно всего документа.</dd> + <dt>{{domxref("MouseEvent.region")}} {{readonlyinline}}</dt> + <dd>Возвращает id затронутого событием региона. Если ни какой регион затронут не был, возвращает null.</dd> + <dt>{{domxref("MouseEvent.relatedTarget")}} {{readonlyinline}}</dt> + <dd>Второстепенная цель события, если таковая есть.</dd> + <dt>{{domxref("MouseEvent.screenX")}} {{readonlyinline}}</dt> + <dd>Отображает X координат указателя мыши в пространстве экрана.</dd> + <dt>{{domxref("MouseEvent.screenY")}} {{readonlyinline}}</dt> + <dd>Отображает Y координат указателя мыши в пространстве экрана.</dd> + <dt>{{domxref("MouseEvent.shiftKey")}} {{readonlyinline}}</dt> + <dd>Возвращает true если клавиша <kbd>shift</kbd> была нажата, когда произошло событие мыши.</dd> + <dt>{{domxref("MouseEvent.which")}} {{non-standard_inline}} {{readonlyinline}}</dt> + <dd>Возвращает код последней нажатой клавиши, когда произошло событие мыши.</dd> + <dt>{{domxref("MouseEvent.mozPressure")}} {{non-standard_inline()}} {{readonlyinline}}</dt> + <dd>Отображает давление которое было осуществленно при нажатии. Значение будет между <code>0.0</code> (минимальное давление) и <code>1.0</code> (максимальное давление).</dd> + <dt>{{domxref("MouseEvent.mozInputSource")}} {{non-standard_inline()}} {{readonlyinline}}</dt> + <dd> + <p>The type of device that generated the event (one of the <code>MOZ_SOURCE_*</code> constants listed below). This lets you, for example, determine whether a mouse event was generated by an actual mouse or by a touch event (which might affect the degree of accuracy with which you interpret the coordinates associated with the event).</p> + </dd> + <dt>{{domxref("MouseEvent.webkitForce")}} {{non-standard_inline()}} {{readonlyinline}}</dt> + <dd>Отображает количество приложенного давления при клике.</dd> + <dt>{{domxref("MouseEvent.x")}} {{experimental_inline}}{{readonlyinline}}</dt> + <dd>Alias для {{domxref("MouseEvent.clientX")}}.</dd> + <dt>{{domxref("MouseEvent.y")}} {{experimental_inline}}{{readonlyinline}}</dt> + <dd>Alias для {{domxref("MouseEvent.clientY")}}</dd> +</dl> + +<h2 id="Константы">Константы</h2> + +<dl> + <dt>{{domxref("MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN")}} {{non-standard_inline}}{{readonlyinline}}</dt> + <dd>Минимальная необходимая сила для обычного клика</dd> + <dt>{{domxref("MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN")}} {{non-standard_inline}}{{readonlyinline}}</dt> + <dd>Минимальная необходимая сила для усиленного клика</dd> +</dl> + +<h2 id="Методы">Методы</h2> + +<p><em>Данный интерфес наследует свойства от родителей, {{domxref("UIEvent")}} and {{domxref("Event")}}.</em></p> + +<dl> + <dt>{{domxref("MouseEvent.getModifierState()")}}</dt> + <dd>Returns the current state of the specified modifier key. See the {{domxref("KeyboardEvent.getModifierState")}}() for details.</dd> + <dt>{{domxref("MouseEvent.initMouseEvent()")}} {{deprecated_inline}}</dt> + <dd>Initializes the value of a <code>MouseEvent</code> created. If the event has already being dispatched, this method does nothing.</dd> +</dl> + +<h2 id="Примеры">Примеры</h2> + +<p>Данный пример демонстрирует симуляцию нажатия левой клавиши мыши (событие мыши генерируется программно) по чекбоксу используя методы DOM.</p> + +<pre class="brush: js">function simulateClick() { + var evt = new <a href="/en-US/docs/Web/API/MouseEvent">MouseEvent</a>("click", { + bubbles: true, + cancelable: true, + view: window + }); + var cb = document.getElementById("checkbox"); //element to click on + var canceled = !cb.<a href="/en-US/docs/Web/API/EventTarget.dispatchEvent" rel="internal" title="en/DOM/element.dispatchEvent">dispatchEvent</a>(evt); + if(canceled) { + // A handler called preventDefault + alert("canceled"); + } else { + // None of the handlers called preventDefault + alert("not canceled"); + } +} +document.getElementById("button").addEventListener('click', simulateClick);</pre> + +<pre class="brush: html"><p><label><input type="checkbox" id="checkbox"> Checked</label> +<p><button id="button">Click me</button> +</pre> + +<p>Нажмите на кнопку, чтобы посмотреть, как работает пример.</p> + +<p>{{ EmbedLiveSample('Example', '', '', '') }}</p> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName("HTML WHATWG", "#dom-mouseevent-region", "MouseEvent.region")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>From {{SpecName('DOM3 Events')}}, added the <code>region</code> property.</td> + </tr> + <tr> + <td>{{SpecName('Pointer Lock','#extensions-to-the-mouseevent-interface','MouseEvent')}}</td> + <td>{{Spec2('Pointer Lock')}}</td> + <td>From {{SpecName('DOM3 Events')}}, added <code>movementX</code> and <code>movementY</code> properties.</td> + </tr> + <tr> + <td>{{SpecName('CSSOM View', '#extensions-to-the-mouseevent-interface', 'MouseEvent')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>From {{SpecName('DOM3 Events')}}, added <code>offsetX</code> and <code>offsetY</code>, <code>pageX</code> and <code>pageY</code>, <code>x,</code> and <code>y</code> properties.</td> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#events-mouseevents','MouseEvent')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>From {{SpecName('DOM2 Events')}}, added the <code>MouseEvent()</code> constructor, the <code>getModifierState()</code> method and the <code>buttons</code> property.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Firefox (Gecko)</th> + <th>Edge</th> + <th>Chrome</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + </tr> + <tr> + <td>{{domxref("MouseEvent.movementX","movementX")}}<br> + {{domxref("MouseEvent.movementY","movementY")}}</td> + <td>{{CompatVersionUnknown()}} {{property_prefix("moz")}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + <tr> + <td>{{ domxref("MouseEvent.buttons", "buttons") }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>43</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td>{{ domxref("MouseEvent.which", "which") }}</td> + <td>1.0</td> + <td>{{CompatVersionUnknown()}}</td> + <td>1.0</td> + <td>9.0</td> + <td>5.0</td> + <td>1.0</td> + </tr> + <tr> + <td>{{domxref("MouseEvent.getModifierState()", "getModifierState()")}}</td> + <td>{{CompatGeckoDesktop(15)}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + </tr> + <tr> + <td>{{domxref("MouseEvent.mozPressure", "mozPressure")}} and {{domxref("MouseEvent.mozInputSource", "mozInputSource")}} {{non-standard_inline}}</td> + <td>{{CompatGeckoDesktop(2)}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td>{{domxref("MouseEvent.MouseEvent", "MouseEvent()")}}</td> + <td>{{CompatGeckoDesktop(11)}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>9.0</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + <tr> + <td>{{domxref("MouseEvent.region")}}</td> + <td>{{CompatGeckoDesktop(32)}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + <tr> + <td>{{domxref("MouseEvent.offsetX")}}, and {{domxref("MouseEvent.offsetY")}}{{experimental_inline}}</td> + <td>{{CompatGeckoDesktop(40)}}</td> + <td>9</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Firefox Mobile (Gecko)</th> + <th>Android</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Посмотрите_также">Посмотрите также</h2> + +<ul> + <li>Its direct parent, {{domxref("UIEvent")}}.</li> +</ul> diff --git a/files/ru/web/api/mouseevent/offsetx/index.html b/files/ru/web/api/mouseevent/offsetx/index.html new file mode 100644 index 0000000000..92b2f0105e --- /dev/null +++ b/files/ru/web/api/mouseevent/offsetx/index.html @@ -0,0 +1,122 @@ +--- +title: MouseEvent.offsetX +slug: Web/API/MouseEvent/offsetX +tags: + - API + - MouseEvent + - Property + - Read-only +translation_of: Web/API/MouseEvent/offsetX +--- +<p>{{APIRef("DOM Events")}}{{SeeCompatTable}}</p> + +<p><code><font face="Open Sans, Arial, sans-serif">Свойство </font><strong>MouseEvent.offsetX</strong></code>, доступное только для чтения,<code> показывает отступ курсора мыши по оси X от края целевого DOM узла.</code></p> + +<p> </p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox">var xOffset = <em>instanceOfMouseEvent</em>.offsetX; +</pre> + +<h3 id="Возвращаемое_значение">Возвращаемое значение</h3> + +<p>Значение с плавающей запятой - double. Ранние версии спецификации определяли возвращаемое значение как целое число. Подробнее смотрите в разделе про совместимость с браузерами.</p> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Характеристка</th> + <th scope="col">Статус</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('CSSOM View', '#dom-mouseevent-offsetx', 'MouseEvent')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>Начальное определение</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("39.0")}}</td> + <td>6</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + <tr> + <td>Переопределено с <code>long</code> на <code>double</code></td> + <td>{{CompatChrome(56)}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Возможность</th> + <th>Android Webview</th> + <th>Chrome for Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Базовая поддержка</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("43.0")}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + <tr> + <td>Переопределено с <code>long</code> на <code>double</code></td> + <td>{{CompatChrome(56)}}</td> + <td>{{CompatChrome(56)}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">Смотрите также</h2> + +<ul> + <li>{{ domxref("MouseEvent") }}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/pagex/index.html b/files/ru/web/api/mouseevent/pagex/index.html new file mode 100644 index 0000000000..ca9b24d6b9 --- /dev/null +++ b/files/ru/web/api/mouseevent/pagex/index.html @@ -0,0 +1,124 @@ +--- +title: MouseEvent.pageX +slug: Web/API/MouseEvent/pageX +translation_of: Web/API/MouseEvent/pageX +--- +<p>{{APIRef("DOM Events")}}</p> + +<p><strong><code><font face="Open Sans, arial, x-locale-body, sans-serif">MouseEvent.</font>pageX</code></strong> - это свойство {{domxref("MouseEvent")}} доступное только для чтения. Данное свойство возвращает значение равное горизонтальной координате, относительно всего документа. Это свойство учитывает любую горизонтальную прокрутку страницы. Первоначально это свойство было определено как длинное целое число. Модуль просмотра CSSOM переопределил его как double float. Подробнее см. Раздел «Совместимость с браузером».</p> + +<h2 id="Syntax" name="Syntax">Синтаксис</h2> + +<pre class="syntaxbox">var <em>pos</em> = <em>event</em>.pageX</pre> + +<h2 id="Syntax" name="Syntax">Примеры</h2> + +<pre><em>var pageX</em> = <em>event</em>.pageX; +pageX === event.clientX + (window.pageYOffset || document.body.scrollTop); +</pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th>Specification</th> + <th>Status</th> + <th>Comment</th> + </tr> + <tr> + <td>{{SpecName('CSSOM View', '#dom-mouseevent-pagex', 'pageX')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>Redefined from <code>long</code> to <code>double</code>.</td> + </tr> + <tr> + <td>{{SpecName('Touch Events', '#widl-Touch-pageX', 'pageX')}}</td> + <td>{{Spec2('TouchEvents')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome(45.0)}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>9</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td>Redefined from <code>long</code> to <code>double</code></td> + <td>{{CompatChrome(56)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile" style="line-height: 19.0909080505371px;"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android Webview</th> + <th>Chrome for Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>Firefox OS</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome(45.0)}}</td> + <td>{{CompatChrome(45.0)}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td>Redefined from <code>long</code> to <code>double</code></td> + <td>{{CompatChrome(56)}}</td> + <td>{{CompatChrome(56)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Смотрите_также"><strong>Смотрите также</strong></h2> + +<ul> + <li>{{domxref("UIEvent.pageX")}}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/screenx/index.html b/files/ru/web/api/mouseevent/screenx/index.html new file mode 100644 index 0000000000..3dfb626393 --- /dev/null +++ b/files/ru/web/api/mouseevent/screenx/index.html @@ -0,0 +1,93 @@ +--- +title: MouseEvent.screenX +slug: Web/API/MouseEvent/screenX +translation_of: Web/API/MouseEvent/screenX +--- +<div>{{APIRef("DOM Events")}}</div> + +<p><strong><code>screenX</code></strong> - read-only свойство интерфейса события {{domxref("MouseEvent")}}, соответствующее горизонтальной координате (смещению) указателя мыши в глобальных (экранных) координатах.</p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox">var <em>x</em> = <em>instanceOfMouseEvent</em>.screenX +</pre> + +<h3 id="Возвращаемое_значение">Возвращаемое значение</h3> + +<p>Значение с плавающей точкой типа <code>double</code>. В ранних версиях этой спецификации определялось как целое число, соответсвующее количеству пикселей. Подробнее см. раздел "Совместимость с браузерами". </p> + +<h2 id="Пример">Пример</h2> + +<p>Этом примерер демонстрирует координаты вашей мыши в случае получения события {{Event("mousemove")}}.</p> + +<h4 id="HTML">HTML</h4> + +<pre class="brush: html"><p>Подвигайте мышью, чтобы увидеть положение ее курсора.</p> +<p id="screen-log"></p></pre> + +<h4 id="JavaScript">JavaScript</h4> + +<pre class="brush: js">let screenLog = document.querySelector('#screen-log'); +document.addEventListener('mousemove', logKey); + +function logKey(e) { + screenLog.innerText = ` + Screen X/Y: ${e.screenX}, ${e.screenY} + Client X/Y: ${e.clientX}, ${e.clientY}`; +}</pre> + +<h4 id="Результат_выполнения">Результат выполнения</h4> + +<p>{{EmbedLiveSample("Example")}}</p> + +<h3 id="Обработка_события">Обработка события</h3> + +<p>Когда вы отлавливаете события на окне, документе или других элементах, имеющих размер, вы можете получить координаты этого события (например, клика), и обработать его соответсвующим образом, например, так, как в этом примере:</p> + +<pre class="brush: js">function checkClickMap(e) { + if (e.screenX < 50) doRedButton(); + if (50 <= e.screenX && e.screenX < 100) doYellowButton(); + if (e.screenX >= 100) doRedButton(); +} +</pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Состояние</th> + <th scope="col">Комментарий</th> + </tr> + <tr> + <td>{{SpecName('CSSOM View','#dom-mouseevent-screenx', 'screenX')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>Переопределяет {{domxref("MouseEvent")}} из long в double.</td> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#widl-MouseEvent-screenX','MouseEvent.screenX')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Нет изменений ср. с {{SpecName('DOM2 Events')}}.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.sceenX')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Первоначальное определение</td> + </tr> + </tbody> +</table> + +<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> + +<div class="hidden">Таблица совместимости на этой странице составлена автоматически автоматически. Если вы хотите дополнить или исправить эту таблицу, выполните команду git checkout для <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и затем pull request.</div> + +<p>{{Compat("api.MouseEvent.screenX")}}</p> + +<h2 id="См._также">См. также</h2> + +<ul> + <li>{{ domxref("MouseEvent") }}</li> + <li>{{ domxref("MouseEvent.screenY","screenY") }}</li> + <li>{{ domxref("MouseEvent.clientX","clientX") }} / {{ domxref("MouseEvent.clientY", "clientY") }}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/shiftkey/index.html b/files/ru/web/api/mouseevent/shiftkey/index.html new file mode 100644 index 0000000000..81aebded0e --- /dev/null +++ b/files/ru/web/api/mouseevent/shiftkey/index.html @@ -0,0 +1,126 @@ +--- +title: MouseEvent.shiftKey +slug: Web/API/MouseEvent/shiftKey +translation_of: Web/API/MouseEvent/shiftKey +--- +<p>{{APIRef("DOM Events")}}</p> + +<p><strong><code>MouseEvent.shiftKey</code></strong>атрибут только для чтения , кторый указывает была ли нажата клваиша <kbd>shift</kbd> . Возвращает (<code>true</code>) если нажата <kbd>shift</kbd>, (<code>false</code>) если нет.</p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox">var <em>shiftKeyPressed</em> = <em>instanceOfMouseEvent</em>.shiftKey +</pre> + +<h3 id="Возвращаемое_значение">Возвращаемое значение</h3> + +<p>Логический</p> + +<h2 id="Example" name="Example">Пример</h2> + +<pre class="brush: js"><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>Нажмите на любую символьную клавишу удерживая или не удерживая клавишу SHIFT.<br /> +Вы также можете использовать клавишу SHIFT вместе с клавишей ALT.</p> +</body> +</html> +</pre> + +<h2 id="Спецификация">Спецификация</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#widl-MouseEvent-shiftKey','MouseEvent.shiftKey')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>No change from {{SpecName('DOM2 Events')}}.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.shiftKey')}}</td> + <td>{{Spec2('DOM2 Events')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Совместимость с браузерами</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + <td>{{CompatVersionUnknown()}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>Android</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + <td>{{ CompatUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">Смотри также</h2> + +<ul> + <li>{{ domxref("MouseEvent") }}</li> +</ul> diff --git a/files/ru/web/api/mouseevent/which/index.html b/files/ru/web/api/mouseevent/which/index.html new file mode 100644 index 0000000000..83e4984abe --- /dev/null +++ b/files/ru/web/api/mouseevent/which/index.html @@ -0,0 +1,47 @@ +--- +title: MouseEvent.which +slug: Web/API/MouseEvent/which +tags: + - API + - "События\_DOM" +translation_of: Web/API/MouseEvent/which +--- +<p>{{APIRef("DOM Events")}}</p> + +<p>{{Non-standard_header}}</p> + +<p><strong><code>MouseEvent.which</code></strong> это свойство только для чтения которое показывает какая именно кнопка мыши вызвала событие MouseEvent. Стандартная альтернатива этому свойству – {{ domxref("MouseEvent.button") }} и {{ domxref("MouseEvent.buttons") }}.</p> + +<h2 id="Синтаксис">Синтаксис</h2> + +<pre class="syntaxbox">var <em>buttonPressed</em> = <em>instanceOfMouseEvent</em>.which +</pre> + +<h3 id="Возвращаемое_значение">Возвращаемое значение</h3> + +<p>Значения соответствующие кнопкам:</p> + +<ul> + <li><code>0</code>: Нет кнопки</li> + <li><code>1</code>: Левая кнопка</li> + <li><code>2</code>: Средняя (если есть)</li> + <li><code>3</code>: Права кнопка</li> +</ul> + +<p>Для мыши настроенной для левшей порядок значений будет изменён. В этом случае значению <code>1</code> будет соответствовать правай кнопка, а <code>3</code> – левая.</p> + +<h2 id="Спецификация">Спецификация</h2> + +<p>Это свойство не является частью спецификации.</p> + +<h2 id="Совместимость_с_бразуерами">Совместимость с бразуерами</h2> + + + +<p>{{Compat("api.MouseEvent.which")}}</p> + +<h2 id="См._также">См. также</h2> + +<ul> + <li>{{ domxref("MouseEvent") }}</li> +</ul> |