initial commit

5 files changed, 534 insertions, 0 deletions

diff --git a/files/zh-cn/web/api/wheelevent/deltamode/index.html b/files/zh-cn/web/api/wheelevent/deltamode/index.html
new file mode 100644
index 0000000000..7db3c83a71
--- /dev/null
+++ b/files/zh-cn/web/api/wheelevent/deltamode/index.html
@@ -0,0 +1,122 @@
+---
+title: WheelEvent.deltaMode
+slug: Web/API/WheelEvent/deltaMode
+translation_of: Web/API/WheelEvent/deltaMode
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><code><strong>WheelEvent.deltaMode</strong></code> 只读属性返回一个 <code>unsigned long</code> 类型的值, 声明 delta 的滚动值的单位. 可能的值为:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Constant</td>
+   <td class="header">Value</td>
+   <td class="header">Description</td>
+  </tr>
+  <tr>
+   <td><code>DOM_DELTA_PIXEL</code></td>
+   <td><code>0x00</code></td>
+   <td>delta 的值为 像素 级别.</td>
+  </tr>
+  <tr>
+   <td><code>DOM_DELTA_LINE</code></td>
+   <td><code>0x01</code></td>
+   <td>delta 的值为 行 级别.</td>
+  </tr>
+  <tr>
+   <td><code>DOM_DELTA_PAGE</code></td>
+   <td><code>0x02</code></td>
+   <td>delta 的值为 页 级别.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <code><em>unit</em> = <em>event</em>.deltaMode;</code></pre>
+
+<h2 id="例子">例子</h2>
+
+<pre class="brush: js">var syntheticEvent = new WheelEvent("syntheticWheel", {"deltaX": 4, "deltaMode": 0});
+
+console.log(syntheticEvent.deltaMode);
+</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-WheelEvent-deltaMode','WheelEvent.deltaMode')}}</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 (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>31</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatGeckoDesktop("17.0") }}</td>
+   <td>{{ CompatIE("9.0") }}</td>
+   <td>18</td>
+   <td>7.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("17.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 class="note" id="另见">另见</h2>
+
+<ul>
+ <li>{{ event("wheel") }}</li>
+ <li>{{domxref("WheelEvent")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/wheelevent/deltax/index.html b/files/zh-cn/web/api/wheelevent/deltax/index.html
new file mode 100644
index 0000000000..ed30709da2
--- /dev/null
+++ b/files/zh-cn/web/api/wheelevent/deltax/index.html
@@ -0,0 +1,99 @@
+---
+title: WheelEvent.deltaX
+slug: Web/API/WheelEvent/deltaX
+translation_of: Web/API/WheelEvent/deltaX
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><code><strong>WheelEvent.deltaX</strong></code> 只读属性是一个 <code>double</code> 类型值, 声明水平滚动量以{{domxref("WheelEvent.deltaMode")}} 为单位.</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <code><em>dX</em> = <em>event</em>.deltaX;</code></pre>
+
+<h2 id="例子">例子</h2>
+
+<pre class="brush: js">var syntheticEvent = new WheelEvent("syntheticWheel", {"deltaX": 4, "deltaMode": 0});
+
+console.log(syntheticEvent.deltaX);
+</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-WheelEvent-deltaX','WheelEvent.deltaX')}}</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 (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>31</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("17.0") }}</td>
+   <td>{{ CompatIE("9.0") }} [1]</td>
+   <td>18</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("17.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] IE9 支持一个规范的一个旧版本的草稿, 这里的值的类型是 <code>long</code> 而不是一个 <code>double</code> 类型的值.</p>
+
+<h2 class="note" id="另见">另见</h2>
+
+<ul>
+ <li>{{ event("wheel") }}</li>
+ <li>{{domxref("WheelEvent")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/wheelevent/deltay/index.html b/files/zh-cn/web/api/wheelevent/deltay/index.html
new file mode 100644
index 0000000000..1f223c3b37
--- /dev/null
+++ b/files/zh-cn/web/api/wheelevent/deltay/index.html
@@ -0,0 +1,101 @@
+---
+title: WheelEvent.deltaY
+slug: Web/API/WheelEvent/deltaY
+translation_of: Web/API/WheelEvent/deltaY
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p> </p>
+
+<p><code><strong>WheelEvent.deltaY</strong></code> 只读属性是一个 <code>double</code> 类型值, 声明垂直滚动量以<a href="https://developer.mozilla.org/zh-CN/docs/Web/API/WheelEvent/deltaMode" title="WheelEvent.deltaMode 只读属性返回一个 unsigned long 类型的值, 声明 delta 的滚动值的单位. 可能的值为:"><code>WheelEvent.deltaMode</code></a> 为单位.</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <code><em>dY</em> = <em>event</em>.deltaY;</code></pre>
+
+<h2 id="例子">例子</h2>
+
+<pre class="brush: js">var syntheticEvent = new WheelEvent("syntheticWheel", {"deltaY": 4, "deltaMode": 0});
+
+console.log(syntheticEvent.deltaY);
+</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-WheelEvent-deltaY','WheelEvent.deltaY')}}</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 (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>31</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("17.0") }}</td>
+   <td>{{ CompatIE("9.0") }} [1]</td>
+   <td>18</td>
+   <td>9.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("17.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] IE9 支持一个规范的一个旧版本的草稿, 这里的值的类型是 <code>long</code> 而不是一个 <code>double</code> 类型的值.</p>
+
+<h2 class="note" id="另见">另见</h2>
+
+<ul>
+ <li>{{ event("wheel") }}</li>
+ <li>{{domxref("WheelEvent")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/wheelevent/deltaz/index.html b/files/zh-cn/web/api/wheelevent/deltaz/index.html
new file mode 100644
index 0000000000..d80bf95202
--- /dev/null
+++ b/files/zh-cn/web/api/wheelevent/deltaz/index.html
@@ -0,0 +1,103 @@
+---
+title: WheelEvent.deltaZ
+slug: Web/API/WheelEvent/deltaZ
+translation_of: Web/API/WheelEvent/deltaZ
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p> </p>
+
+<p><code><strong>WheelEvent.deltaZ</strong></code> 只读属性是一个 <code>double</code> 类型值, 声明 Z 轴滚动量以<a href="https://developer.mozilla.org/zh-CN/docs/Web/API/WheelEvent/deltaMode" title="WheelEvent.deltaMode 只读属性返回一个 unsigned long 类型的值, 声明 delta 的滚动值的单位. 可能的值为:"><code>WheelEvent.deltaMode</code></a> 为单位.</p>
+
+<p> </p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <code><em>dZ</em> = <em>event</em>.deltaZ;</code></pre>
+
+<h2 id="例子">例子</h2>
+
+<pre class="brush: js">var syntheticEvent = new WheelEvent("syntheticWheel", {"deltaZ": 4, "deltaMode": 0});
+
+console.log(syntheticEvent.deltaZ);
+</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-WheelEvent-deltaZ','WheelEvent.deltaZ')}}</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 (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>31</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("17.0") }}</td>
+   <td>{{ CompatIE("9.0") }} [1]</td>
+   <td>18</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("17.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] IE9 支持一个规范的一个旧版本的草稿, 这里的值的类型是 <code>long</code> 而不是一个 <code>double</code> 类型的值.</p>
+
+<h2 class="note" id="另见">另见</h2>
+
+<ul>
+ <li>{{ event("wheel") }}</li>
+ <li>{{domxref("WheelEvent")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/wheelevent/index.html b/files/zh-cn/web/api/wheelevent/index.html
new file mode 100644
index 0000000000..6cd9881b2e
--- /dev/null
+++ b/files/zh-cn/web/api/wheelevent/index.html
@@ -0,0 +1,109 @@
+---
+title: WheelEvent
+slug: Web/API/WheelEvent
+tags:
+  - API
+  - DOM
+  - Reference
+  - WheelEvent
+  - 接口
+translation_of: Web/API/WheelEvent
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><code><strong>WheelEvent</strong></code> 接口表示用户滚动鼠标滚轮或类似输入设备时触发的事件。</p>
+
+<div class="warning"><strong>重要：该事件为标准规定的滚轮事件接口。</strong>早期的浏览器实现过{{ domxref("MouseWheelEvent") }}和{{domxref("MouseScrollEvent")}}两种滚轮事件接口，但这两种接口皆非标准，加之各浏览器间对其兼容性极差。因而开发者应使用该标准事件接口取代这两个非标准接口。</div>
+
+<div class="note"><strong>不要混淆 <code>wheel</code> 事件和 {{event("scroll")}} 事件：</strong>{{event("wheel")}} 事件的默认动作取决于浏览器实现。因此 <code>wheel</code> 事件不一定会触发 {{event("scroll")}} 事件。即便滚轮事件引发了文档内容的滚动行为，也不表示 <code>wheel</code> 事件中的 <code>delta*</code> 值恰好反映文档内容的滚动方向。因此，不要依赖 <code>delta*</code> 属性获知文档内容的滚动方向。可在文档内容滚动事件（{{event("scroll")}}）中监视target的{{domxref("Element.scrollLeft", "scrollLeft")}}和{{domxref("Element.scrollTop", "scrollTop")}}的变化以推断滚动方向。</div>
+
+<p>{{InheritanceDiagram}}</p>
+
+<h2 id="构造函数">构造函数</h2>
+
+<dl>
+ <dt>{{domxref("WheelEvent.WheelEvent", "WheelEvent()")}}</dt>
+ <dd>创建一个<code>WheelEvent</code>对象。</dd>
+</dl>
+
+<h2 id="属性">属性</h2>
+
+<p><em>该接口继承了父接口{{domxref("MouseEvent")}}、{{domxref("UIEvent")}}、{{domxref("Event")}}的属性。</em></p>
+
+<dl id="raw_prop">
+ <dt>{{domxref("WheelEvent.deltaX")}} {{readonlyinline}}</dt>
+ <dd>返回<code>double</code>值，该值表示滚轮的横向滚动量。</dd>
+ <dt>{{domxref("WheelEvent.deltaY")}} {{readonlyinline}}</dt>
+ <dd>返回<code>double</code>值，该值表示滚轮的纵向滚动量。</dd>
+ <dt>{{domxref("WheelEvent.deltaZ")}} {{readonlyinline}}</dt>
+ <dd>返回<code>double</code>值，该值表示滚轮的z轴方向上的滚动量。</dd>
+ <dt>{{domxref("WheelEvent.deltaMode")}} {{readonlyinline}}</dt>
+ <dd>返回<code>unsigned long</code>值，该值表示上述各<code>delta*</code>的值的单位。该值及所表示的单位如下：
+ <table class="standard-table">
+  <tbody>
+   <tr>
+    <td class="header">常量</td>
+    <td class="header">值</td>
+    <td class="header">描述</td>
+   </tr>
+   <tr>
+    <td><code>DOM_DELTA_PIXEL</code></td>
+    <td><code>0x00</code></td>
+    <td>滚动量单位为像素。</td>
+   </tr>
+   <tr>
+    <td><code>DOM_DELTA_LINE</code></td>
+    <td><code>0x01</code></td>
+    <td>滚动量单位为行。</td>
+   </tr>
+   <tr>
+    <td><code>DOM_DELTA_PAGE</code></td>
+    <td><code>0x02</code></td>
+    <td>滚动量单位为页。</td>
+   </tr>
+  </tbody>
+ </table>
+ </dd>
+</dl>
+
+<h2 id="方法">方法</h2>
+
+<p><em>该接口本身未定义方法，但继承了父接口{{domxref("MouseEvent")}}、{{domxref("UIEvent")}}、{{domxref("Event")}}的方法。</em></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("UI Events", "#interface-wheelevent", "The <code>WheelEvent</code> interface")}}</td>
+   <td>{{Spec2("UI Events")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Events','#interface-wheelevent','WheelEvent')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+<p>{{Compat("api.WheelEvent")}}</p>
+
+<h2 id="参见">参见</h2>
+
+<ul>
+ <li>{{ event("wheel") }} 事件</li>
+ <li>该接口取代的过时接口：
+  <ul>
+   <li>{{ domxref("MouseScrollEvent") }}（Gecko内核浏览器）</li>
+   <li>{{ domxref("MouseWheelEvent") }}（非Gecko内核的浏览器）</li>
+  </ul>
+ </li>
+</ul>