initial commit

4 files changed, 414 insertions, 0 deletions

diff --git a/files/ru/web/api/touchevent/altkey/index.html b/files/ru/web/api/touchevent/altkey/index.html
new file mode 100644
index 0000000000..2ec99f56f9
--- /dev/null
+++ b/files/ru/web/api/touchevent/altkey/index.html
@@ -0,0 +1,68 @@
+---
+title: TouchEvent.altKey
+slug: Web/API/TouchEvent/altKey
+translation_of: Web/API/TouchEvent/altKey
+---
+<p>{{APIRef("Touch Events") }}</p>
+
+<h2 id="Summary" name="Summary">Сводка</h2>
+
+<p>Логическое ({{jsxref("Boolean")}}) значение, показывающее, была ли активирована клавиша <kbd>alt</kbd> (Alternate), когда событие касания было создано. Если клавиша <kbd>alt</kbd> активирована, значение равно <code>true</code>. В противном случае оно равно<code>false</code>.</p>
+
+<p>Данное свойство предназначено {{readonlyInline}}.</p>
+
+<h2 id="Syntax" name="Syntax">Синтаксис</h2>
+
+<pre class="eval">var <em>altEnabled</em> = <em>touchEvent</em>.altKey;
+</pre>
+
+<h3 id="Return_Value" name="Return_Value">Возвращаемое значение</h3>
+
+<dl>
+ <dt><code>altEnabled</code></dt>
+ <dd><code>true</code> если клавиша <kbd>alt</kbd> активирована для данного события; и <code>false</code> если нет.</dd>
+</dl>
+
+<h2 id="Пример">Пример</h2>
+
+<p>Данный пример демонстрирует доступ к свойствам клавиш-модификаторов события {{domxref("TouchEvent")}}: {{domxref("TouchEvent.altKey")}}, {{domxref("TouchEvent.ctrlKey")}}, {{domxref("TouchEvent.metaKey")}} и {{domxref("TouchEvent.shiftKey")}}.</p>
+
+<p>В фрагменте кода ниже обработчик события {{event("touchstart")}} логирует <span class="tlid-translation translation" lang="ru"><span title="">состояние клавиш-модификаторов события</span></span>.</p>
+
+<pre class="brush: js">someElement.addEventListener('touchstart', function(e) {
+   // Log the state of this event's modifier keys
+   console.log("altKey = " + e.altKey);
+   console.log("ctrlKey = " + e.ctrlKey);
+   console.log("metaKey = " + e.metaKey);
+   console.log("shiftKey = " + e.shiftKey);
+}, false);
+
+</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('Touch Events 2','#widl-TouchEvent-altKey')}}</td>
+   <td>{{Spec2('Touch Events 2')}}</td>
+   <td>Нестабильная версия.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Touch Events','#widl-TouchEvent-altKey')}}</td>
+   <td>{{Spec2('Touch Events')}}</td>
+   <td>Начальное определение.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Поддержка_браузерами">Поддержка браузерами</h2>
+
+
+
+<p>{{Compat("api.TouchEvent.altKey")}}</p>
diff --git a/files/ru/web/api/touchevent/changedtouches/index.html b/files/ru/web/api/touchevent/changedtouches/index.html
new file mode 100644
index 0000000000..0d710b6ad7
--- /dev/null
+++ b/files/ru/web/api/touchevent/changedtouches/index.html
@@ -0,0 +1,133 @@
+---
+title: TouchEvent.changedTouches
+slug: Web/API/TouchEvent/changedTouches
+translation_of: Web/API/TouchEvent/changedTouches
+---
+<p>{{ APIRef("Touch Events") }}</p>
+
+<h2 id="Summary" name="Summary">Сводка</h2>
+
+<p>{{ domxref("TouchList") }} список точек касания (обьекта {{domxref("Touch")}}), <span id="result_box" lang="ru"><span>смысл которых зависит от типа события</span></span>:</p>
+
+<ul>
+ <li>Для события <code>touchstart</code>, это список точек касания, в которых появилось взаимодействие с поверхностью экрана.</li>
+ <li>Для события <code>touchmove</code>,  это список точек касания, которые изменились с момента последнего события.</li>
+ <li>Для события <code>touchend</code>, это список точек касания, на которых прекратилось взаимодействие с поверхностью экрана (т. е. набор точек,  где прервалось касание пальцами).</li>
+</ul>
+
+<p>Это свойство предназначено {{readonlyInline}}.</p>
+
+<h2 id="Syntax" name="Syntax">Синтаксис</h2>
+
+<pre class="eval">var <em>changes</em> = <em>touchEvent</em>.changedTouches;
+</pre>
+
+<h3 id="Return_Value" name="Return_Value">Возвращаемое значение</h3>
+
+<dl>
+ <dt><code>changes</code></dt>
+ <dd>Список {{ domxref("TouchList") }} обьекта {{ domxref("Touch") }} в котором содержатся все точки касания для данного события.</dd>
+</dl>
+
+<h2 id="Пример">Пример</h2>
+
+<p>Этот пример демонстрирует свойство {{domxref("TouchEvent.changedTouches")}} обьекта  {{domxref("TouchEvent")}}. Свойство {{domxref("TouchEvent.changedTouches")}} это — обьект {{domxref("TouchList")}}, который содержит обьект {{domxref("Touch")}} для каждой точки, где произошло событие.</p>
+
+<p>В этом фрагменте кода обработчик события {{event("touchmove")}} выполняет перебор списка  <code>changedTouches</code> и выводит в консоль <span id="result_box" lang="ru"><span>идентификатор каждой точки касания, где произошло изменение с последнего события.</span></span></p>
+
+<pre class="brush: js">someElement.addEventListener('touchmove', function(e) {
+   // Iterate through the list of touch points that changed
+   // since the last event and print each touch point's identifier.
+   for (var i=0; i &lt; e.changedTouches.length; i++) {
+     console.log("changedTouches[" + i + "].identifier = " + e.changedTouches[i].identifier);
+   }
+}, false);
+
+</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('Touch Events 2','#widl-TouchEvent-changedTouches')}}</td>
+   <td>{{Spec2('Touch Events 2')}}</td>
+   <td>Нестабильная версия.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Touch Events','#widl-TouchEvent-changedTouches')}}</td>
+   <td>{{Spec2('Touch Events')}}</td>
+   <td>Начальное определение.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Поддержка_браузерами">Поддержка браузерами</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 (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Базовая поддержка</td>
+   <td>{{CompatChrome("22.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("18.0")}}<sup>[1]</sup><br>
+    {{CompatGeckoDesktop("52.0")}}<sup>[2]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Особенность</th>
+   <th>Android</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>Базовая поддержка</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("6.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>11</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] События касания были добавлены в Gecko 18.0, но затем удалены в 24.0 {{geckoRelease("24.0")}} в настольной версии Firefox из-за проблем совместимости ({{bug(888304)}}).</p>
+
+<p>[2] Начиная с Gecko 52.0, поддержка событий касания была восстановлена для настольных платформ на базе Windows.</p>
diff --git a/files/ru/web/api/touchevent/index.html b/files/ru/web/api/touchevent/index.html
new file mode 100644
index 0000000000..761204b552
--- /dev/null
+++ b/files/ru/web/api/touchevent/index.html
@@ -0,0 +1,145 @@
+---
+title: TouchEvent
+slug: Web/API/TouchEvent
+tags:
+  - API
+  - DOM
+  - Interface
+  - NeedsTranslation
+  - Reference
+  - TopicStub
+  - touch
+translation_of: Web/API/TouchEvent
+---
+<p>{{ APIRef("Touch Events") }}</p>
+
+<p>Интерфейс <strong><code>TouchEvent</code></strong> отражает событие {{domxref("UIEvent")}}, возникающее при изменении состояния касаний к сенсорной поверхности. К таким поверхностям можно отнести, например, сенсорные экраны или трекпады. Событие может описывать одну или несколько точек касания экрана и включает поддержку обнаружения движения, добавление и удаление точек касаний и так далее.</p>
+
+<p>Каждое прикосновение представлено объектом {{ domxref("Touch") }}, который содержит данные о позиции, размере, форме, степени давления и целевом элементе. Список прикосновений представлен объектом {{ domxref("TouchList") }}.</p>
+
+<p>{{InheritanceDiagram}}</p>
+
+<h2 id="Конструктор">Конструктор</h2>
+
+<dl>
+ <dt>{{domxref("TouchEvent.TouchEvent", "TouchEvent()")}}</dt>
+ <dd>Создает экземпляр <code>TouchEvent</code>.</dd>
+</dl>
+
+<h2 id="Свойства">Свойства</h2>
+
+<p><em>Данный интерфейс наследует свойства своих предков, {{domxref("UIEvent")}} и {{domxref("Event")}}.</em></p>
+
+<dl>
+ <dt>{{ domxref("TouchEvent.altKey") }} {{readonlyInline}}</dt>
+ <dd>Булево значение, показывающее, была ли нажата клавиша <kbd>alt</kbd>, когда произошло событие касания.</dd>
+ <dt>{{ domxref("TouchEvent.changedTouches") }} {{readonlyInline}}</dt>
+ <dd>Список {{ domxref("TouchList") }}, со всеми объектами {{ domxref("Touch") }}, представляющими отдельные точки касания, состояние которых изменилось между предыдущим событием касания и текущим.</dd>
+ <dt>{{ domxref("TouchEvent.ctrlKey") }} {{readonlyInline}}</dt>
+ <dd>Булево значение, показывающее, была ли нажата клавиша <kbd>ctrl</kbd>, когда произошло событие касания</dd>
+ <dt>{{ domxref("TouchEvent.metaKey") }} {{readonlyInline}}</dt>
+ <dd>Булево значение, показывающее, была ли нажата клавиша <kbd>meta</kbd>, когда произошло событие касания.</dd>
+ <dt>{{ domxref("TouchEvent.shiftKey") }} {{readonlyInline}}</dt>
+ <dd>Булево значение, показывающее, была ли нажата клавиша <kbd>shift</kbd>, когда произошло событие касания.</dd>
+ <dt>{{ domxref("TouchEvent.targetTouches") }}{{readonlyInline}}</dt>
+ <dd>Список {{ domxref("TouchList") }} со всеми объектами {{ domxref("Touch") }}, представляющими <span class="tlid-translation translation" lang="ru"><span title="">текущие точки касания с сенсорной поверхностью,</span></span> которые находятся на одном и том же целевом элементе target.</dd>
+ <dt>{{ domxref("TouchEvent.touches") }} {{readonlyInline}}</dt>
+ <dd>Список {{ domxref("TouchList") }} со всеми объектами {{ domxref("Touch") }}, представляющими текущие точки касания с сенсорной поверхностью, вне зависимости от целевого элемента и статуса.</dd>
+ <dt>{{domxref("TouchEvent.rotation")}} {{non-standard_inline()}} {{readonlyInline}}</dt>
+ <dd>Изменение угла поворота (в градусах) с момента начала события. Положительные значения указывают на вращение по часовой стрелке, отрицательные - против часовой стрелки. Начальное значение <code>0.0</code></dd>
+ <dt>{{domxref("TouchEvent.scale")}} {{non-standard_inline()}} {{readonlyInline}}</dt>
+ <dd>Расстояние между двумя цифрами с момента начала события. Является числом с плавающей точкой, отражающим расстояние между двумя цифрами в начале события. Значения ниже 1.0 указывают на щипок (уменьшение зума), больше 1.0 - увеличение. Начальное значение: <code>1.0</code></dd>
+</dl>
+
+<h2 id="Типы_событий_касания">Типы событий касания</h2>
+
+<p><span class="tlid-translation translation" lang="ru"><span title="">Существует несколько типов событий, которые могут происходить в ответ на касания</span></span>. О<span class="tlid-translation translation" lang="ru"><span title="">пределить, какое именно событие произошло, можно с помощью свойства </span></span>{{ domxref("event.type", "TouchEvent.type") }}.</p>
+
+<h3 id="domxrefElementtouchstart_event_touchstart">{{domxref("Element/touchstart_event", "touchstart")}}</h3>
+
+<p>Происходит, когда пользователь касается сенсорной поверхности. Целью события будет являться экземпляр {{ domxref("Element") }}, которого коснулись.</p>
+
+<h3 id="domxrefElementtouchend_event_touchend">{{domxref("Element/touchend_event", "touchend")}}</h3>
+
+<p>Происходит, когда пользователь удаляет точку касания поверхности (убирает палец или стилус с поверхности). Также это событие Происходит, если точка касания уходит за границы поверхности; например, если палец пользователя выходит за границу экрана.</p>
+
+<p>Цель события - тот же экземпляр {{ domxref("Element") }}, что и для события <code>touchstart</code> с соответствующей точкой касания, даже если точка касания переместилась за пределы элемента.</p>
+
+<p>Точки касания, удаленные с поверхности, содержатся в списке {{ domxref("TouchList") }}, который можно получить через атрибут <code>changedTouches</code> события.</p>
+
+<h3 id="domxrefElementtouchmove_event_touchmove">{{domxref("Element/touchmove_event", "touchmove")}}</h3>
+
+<p>Происходит, когда пользователь двигает точку касания по поверхности. Цель события - тот же экземпляр {{ domxref("element") }}, что и для события <code>touchstart</code> с соответствующей точкой касания, даже если точка касания переместилась за пределы элемента.</p>
+
+<p>Это событие также возникает, если изменилось значение радиуса, угла вращения или силы нажатия в точке касания.</p>
+
+<div class="note"><strong>Примечание:</strong> Промежуток времени, в течении которого возникают события <code>touchmove</code>, зависит от конкретного браузера, а также может сильно зависеть от возможностей устройства пользователя. Вам не следует полагаться на конкретную частоту возникновения этих событий.</div>
+
+<h3 id="touchcancel_event" name="touchcancel_event">{{domxref("Element/touchcancel_event", "touchcancel")}}</h3>
+
+<p>Происходит, если точка касания была по какой-либо причине удалена. Существует несколько возможных причин, почему это может произойти (и конкретные причины могут разниться от устройства к устройству, от браузера к браузеру):</p>
+
+<ul>
+ <li><span class="tlid-translation translation" lang="ru"><span title="">Произошло какое-то событие, отменившее прикосновение;</span> <span title="">это может произойти, если во время взаимодействия появляется модальное окно</span></span>.</li>
+ <li><span class="tlid-translation translation" lang="ru"><span title="">Точка касания покинула окно документа и переместилась в область пользовательского интерфейса браузера, подключаемого модуля или другого внешнего содержимого</span></span>.</li>
+ <li>Пользователь задал больше точек касания на экране, чем поддерживается, в этом случае наиболее ранние точки {{ domxref("Touch") }} в списке {{ domxref("TouchList") }} будут отменены.</li>
+</ul>
+
+<h3 id="Использование_addEventListener_и_preventDefault">Использование addEventListener() и preventDefault()</h3>
+
+<p>Важно отметить, что во многих случаях происходят и события касаний, и события мыши (чтобы код, не использующий касания, мог продолжать взаимодействовать с пользователем). Если вы используете события касания, вам следует вызывать {{domxref("Event.preventDefault","preventDefault()")}} для предотвращения отправки событий мыши.</p>
+
+<p>Исключением из этого правила является браузер Chrome, начиная с версии 56 (настольный, Chrome для android, и android webview), в которой значение по-умолчанию для {{event("touchstart")}} и {{event("touchmove")}} равно <code>true</code> и вызовы метода {{domxref("Event.preventDefault","preventDefault()")}} не требуются. Чтобы переопределить такое поведение, просто установите значение опции <code>passive</code> равным <code>false</code> как показано в примере ниже. Это изменение <span class="tlid-translation translation" lang="ru"><span title="">запрещает обработчику блокировать отрисовку страницы во время прокрутки пользователем</span></span>. Демонстрация этого доступна на сайте <a href="https://developers.google.com/web/updates/2016/06/passive-event-listeners">Google Developer</a>.</p>
+
+<h2 id="GlobalEventHandlers">GlobalEventHandlers</h2>
+
+<p>{{SeeCompatTable}}</p>
+
+<dl>
+ <dt>{{ domxref("GlobalEventHandlers.ontouchstart") }} {{experimental_inline}}</dt>
+ <dd>Обработчик {{domxref("GlobalEventHandlers","global event handler")}} для события {{event("touchstart")}}.</dd>
+ <dt>{{ domxref("GlobalEventHandlers.ontouchend") }} {{experimental_inline}}</dt>
+ <dd>Обработчик {{domxref("GlobalEventHandlers","global event handler")}} для события {{event("touchend")}}.</dd>
+ <dt>{{ domxref("GlobalEventHandlers.ontouchmove") }} {{experimental_inline}}</dt>
+ <dd>Обработчик {{domxref("GlobalEventHandlers","global event handler")}} для события {{event("touchmove")}}.</dd>
+ <dt>{{ domxref("GlobalEventHandlers.ontouchcancel") }} {{experimental_inline}}</dt>
+ <dd>Обработчик {{domxref("GlobalEventHandlers","global event handler")}} для события {{event("touchcancel")}}.</dd>
+</dl>
+
+<h2 id="Пример">Пример</h2>
+
+<p>Смотрите <a href="/en/DOM/Touch_events#Example" title="en/DOM/Touch events#Example">пример в основной статье о событиях касания</a>.</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('Touch Events 2','#touchevent-interface', 'TouchEvent')}}</td>
+   <td>{{Spec2('Touch Events 2')}}</td>
+   <td>Добавлены глобальные атрибуты обработчиков <code>ontouchstart</code>, <code>ontouchend</code>, <code>ontouchmove</code>, <code>ontouchend</code></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Touch Events', '#touchevent-interface', 'TouchEvent')}}</td>
+   <td>{{Spec2('Touch Events')}}</td>
+   <td>Начальное определение</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Поддержка_браузерами">Поддержка браузерами</h2>
+
+<p>{{Compat("api.TouchEvent")}}</p>
+
+<h2 id="Смотрите_также">Смотрите также</h2>
+
+<ul>
+ <li>{{domxref("Touch_events","Touch Events Overview")}}</li>
+ <li>{{domxref("GestureEvent")}}</li>
+ <li>{{domxref("MSGestureEvent")}}</li>
+</ul>
diff --git a/files/ru/web/api/touchevent/touches/index.html b/files/ru/web/api/touchevent/touches/index.html
new file mode 100644
index 0000000000..090fa66e70
--- /dev/null
+++ b/files/ru/web/api/touchevent/touches/index.html
@@ -0,0 +1,68 @@
+---
+title: TouchEvent.touches
+slug: Web/API/TouchEvent/touches
+translation_of: Web/API/TouchEvent/touches
+---
+<p>{{ APIRef("Touch Events") }}</p>
+
+<p><code><strong>touches</strong></code> это доступный только для чтения список {{ domxref("TouchList") }}, в котором перечислены все объекты {{ domxref("Touch") }} для точек контакта с сенсорной поверхностью, независимо от того, изменились ли они и какой целевой элемент был у них во время события {{event("touchstart")}}.</p>
+
+<p>Вы можете воспринимать это как перечисление отдельных пальцев, которые могут быть идентифицированы при касании экрана.</p>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="syntaxbox notranslate">var <em>touches</em> = <em>touchEvent</em>.touches;
+</pre>
+
+<h3 id="Возвращаемое_значение">Возвращаемое значение</h3>
+
+<dl>
+ <dt><code>touches</code></dt>
+ <dd>Список {{ domxref("TouchList") }} всех объектов {{ domxref("Touch") }} для точек контакта с сенсорной поверхностью, независимо от того, изменились ли они и какой целевой элемент был у них во время события {{event("touchstart")}}. </dd>
+</dl>
+
+<h2 id="Пример">Пример</h2>
+
+<p>Этот пример демонтсрирует свойство {{domxref("TouchEvent.touches")}} объекта {{domxref("TouchEvent")}}. Свойство {{domxref("TouchEvent.touches")}} это объект {{domxref("TouchList")}}, который содержит список объектов {{domxref("Touch")}} для каждой активной точки контакта с сенсорной поверхностью.</p>
+
+<p>В следующем фрагменте кода обработчик события {{event("touchstart")}} проверяет длину списка {{domxref("TouchEvent.touches")}} для определения количества точек касаний, которые были активированы, а затем вызывает разные обработчики в зависимости от количества таких точек.</p>
+
+<pre class="brush: js notranslate">someElement.addEventListener('touchstart', function(e) {
+   // Вызов определённого обработчика, в зависимости от
+   // количества точек касания
+   switch (e.touches.length) {
+     case 1: handle_one_touch(e); break;
+     case 2: handle_two_touches(e); break;
+     case 3: handle_three_touches(e); break;
+     default: console.log("Not supported"); break;
+   }
+ }, false);
+</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('Touch Events 2','#dom-touchevent-touches')}}</td>
+   <td>{{Spec2('Touch Events 2')}}</td>
+   <td>Non-stable version.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Touch Events','#widl-TouchEvent-touches')}}</td>
+   <td>{{Spec2('Touch Events')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Поддержка_браузерами">Поддержка браузерами</h2>
+
+
+
+<p>{{Compat("api.TouchEvent.touches")}}</p>