initial commit

26 files changed, 2952 insertions, 0 deletions

diff --git a/files/zh-cn/web/api/mouseevent/altkey/index.html b/files/zh-cn/web/api/mouseevent/altkey/index.html
new file mode 100644
index 0000000000..0ced8e2f28
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/altkey/index.html
@@ -0,0 +1,124 @@
+---
+title: MouseEvent.altKey
+slug: Web/API/MouseEvent/altKey
+tags:
+  - DOM事件
+  - altKey
+  - 只读属性
+  - 鼠标事件
+translation_of: Web/API/MouseEvent/altKey
+---
+<p id="Summary">{{APIRef("DOM Events")}}</p>
+
+<p><strong><code>MouseEvent.altKey</code></strong> 只读属性是一个{{jsxref("Boolean")}}变量。当事件触发时，如果<kbd>alt</kbd> 被按下，则返回 true，否则返回false。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <em>altKeyPressed</em> = <em>instanceOfMouseEvent</em>.altKey
+</pre>
+
+<h2 id="示例">示例</h2>
+
+<pre class="brush: js">&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;altKey example&lt;/title&gt;
+
+&lt;script type="text/javascript"&gt;
+
+function showChar(e){
+  alert(
+    "Key Pressed: " + String.fromCharCode(e.charCode) + "\n"
+    + "charCode: " + e.charCode + "\n"
+    + "ALT key pressed: " + e.altKey + "\n"
+  );
+}
+
+&lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body onkeypress="showChar(event);"&gt;
+&lt;p&gt;
+Press any character key,
+with or without holding down the ALT key.&lt;br /&gt;
+You can also use the SHIFT key together with the ALT key.
+&lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;</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-altKey','MouseEvent.altkey')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>No change from {{SpecName('DOM2 Events')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.altkey')}}</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>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>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</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>{{ 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/zh-cn/web/api/mouseevent/button/index.html b/files/zh-cn/web/api/mouseevent/button/index.html
new file mode 100644
index 0000000000..57df922ffd
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/button/index.html
@@ -0,0 +1,111 @@
+---
+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>用户可能会改变鼠标按键的配置，因此当一个事件的<strong><code>MouseEvent.button</code></strong>值为0时，它可能不是由物理上设备最左边的按键触发的。但是对于一个标准按键布局的鼠标来说就会是左键。</p>
+
+<div class="note">
+<p><strong>注意：</strong>{{domxref("MouseEvent.buttons")}} 属性可指示任意鼠标事件中鼠标的按键情况，因此不要把它和MouseEvent.button属性弄混淆了。</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>
+  <p><code>0</code>：主按键，通常指鼠标左键或默认值（译者注：如document.getElementById('a').click()这样触发就会是默认值）</p>
+ </li>
+ <li><code>1</code>：辅助按键，通常指鼠标滚轮中键</li>
+ <li><code>2</code>：次按键，通常指鼠标右键</li>
+ <li><code>3</code>：第四个按钮，通常指浏览器后退按钮</li>
+ <li>
+  <p><code>4</code>：第五个按钮，通常指浏览器的前进按钮</p>
+ </li>
+</ul>
+
+<p>对于配置为左手使用的鼠标，按键操作将正好相反。此种情况下，从右至左读取值。</p>
+
+<h2 id="示例">示例</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html notranslate">&lt;button id="button" oncontextmenu="event.preventDefault();"&gt;Click here with your mouse...&lt;/button&gt;
+&lt;p id="log"&gt;&lt;/p&gt;
+</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="brush: js notranslate">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: ${e.button}`;
+    }
+  }
+}</pre>
+
+<h3 id="结果">结果</h3>
+
+<p>{{EmbedLiveSample("示例")}}</p>
+
+<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>
+
+<div class="hidden">
+<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+</div>
+
+<p>{{Compat("api.MouseEvent.button")}}</p>
+
+<h2 id="参阅">参阅</h2>
+
+<ul>
+ <li>{{domxref('"MouseEvent"')}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/buttons/index.html b/files/zh-cn/web/api/mouseevent/buttons/index.html
new file mode 100644
index 0000000000..4e1b1afd0f
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/buttons/index.html
@@ -0,0 +1,121 @@
+---
+title: MouseEvent.buttons
+slug: Web/API/MouseEvent/buttons
+translation_of: Web/API/MouseEvent/buttons
+---
+<div>{{APIRef("DOM Events")}}</div>
+
+<div>只读属性<strong><code>MouseEvent.buttons</code></strong><code>指示事件触发时哪些鼠标按键被按下。</code></div>
+
+<div></div>
+
+<p>每一个按键都用一个给定的数（见下文）表示。如果同时多个按键被按下，buttons 的值为各键对应值做与计算（+）后的值。例如，如果右键（2）和滚轮键（4）被同时按下，buttons 的值为 2 + 4 = 6。</p>
+
+<div class="note">
+<p><strong>注意：</strong>属性 MouseEvent.button 和 MouseEvent.buttons 是不同的。MouseEvent.buttons 可指示任意鼠标事件中鼠标的按键情况，而 MouseEvent.button 只能保证在由按下和释放一个或多个按键时触发的事件中获得正确的值。</p>
+</div>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <em>buttonPressed</em> = <em>instanceOfMouseEvent</em>.buttons
+</pre>
+
+<h2 id="返回值">返回值</h2>
+
+<p>一个数字，用来标识鼠标按下的一个或者多个按键。如果按下的键为多个，则值等于所有按键对应数值进行或(|)运算的结果。</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="Specifications">Specifications</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="Browser_compatibility">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}}<sup>[1]</sup></td>
+   <td>43<sup>[2]</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>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] Gecko supports the <code>buttons</code> attribute on Windows, Linux (GTK), and Mac OS with the following restrictions:</p>
+
+<ul>
+ <li>On Windows, if you install a mouse driver, and its utility software allows you to customize button actions (e.g., IntelliPoint and SetPoint), the middle (wheel) button, the 4th button, and the 5th button might not be set, even when they are pressed.</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>
+
+<p>[2] This feature got implemented in <a href="https://crbug.com/276941">bug 276941</a>.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("MouseEvent")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/clientx/index.html b/files/zh-cn/web/api/mouseevent/clientx/index.html
new file mode 100644
index 0000000000..009b338b12
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/clientx/index.html
@@ -0,0 +1,85 @@
+---
+title: MouseEvent.clientX
+slug: Web/API/MouseEvent/clientX
+tags:
+  - API
+  - DOM
+  - DOM Events
+translation_of: Web/API/MouseEvent/clientX
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><strong><code>MouseEvent.clientX</code></strong> 是只读属性， 它提供事件发生时的应用客户端区域的水平坐标 (与页面坐标不同)。例如，不论页面是否有水平滚动，当你点击客户端区域的左上角时，鼠标事件的 <code>clientX</code> 值都将为 0 。最初这个属性被定义为长整型（long integer），如今 <strong>CSSOM </strong>视图模块将其重新定义为双精度浮点数（double float）。你可以查阅浏览器兼容性部分的文档来进一步了解有关信息。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox"><code>
+var <em>x</em> = <em>instanceOfMouseEvent</em>.clientX
+</code></pre>
+
+<h3 id="返回值"><code>返回值</code></h3>
+
+<p>被 CSSOM View Module 重新定义为一个 <code>double</code> 类型的浮点值. 原来这个属性是被定义为一个 <code>long</code> 整数. 可以在 "浏览器兼容性" 那里查看详细内容.</p>
+
+<h2 id="Example" name="Example">示例</h2>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;clientX/clientY example&lt;/title&gt;
+
+    &lt;script&gt;
+      function showCoords(evt){
+        alert(
+          "clientX value: " + evt.clientX + "\n" +
+          "clientY value: " + evt.clientY + "\n"
+        );
+      }
+    &lt;/script&gt;
+  &lt;/head&gt;
+  &lt;body onmousedown="showCoords(event)"&gt;
+    &lt;p&gt;To display the mouse coordinates click anywhere on the page.&lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</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('CSSOM View','#dom-mouseevent-clientx', 'clientX')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td>Redefines {{domxref("MouseEvent")}} from <code>long</code> to <code>double</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Events','#widl-MouseEvent-clientX','MouseEvent.clientX')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>No change from {{SpecName('DOM2 Events')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.clientX')}}</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.clientX")}}</p>
+
+<h2 id="See_also" name="See_also">相关</h2>
+
+<ul>
+ <li><code><code>{{ domxref("MouseEvent") }}</code></code></li>
+ <li><code><code>{{domxref("event.clientY","clientY")}}</code></code></li>
+ <li><code><code>{{domxref("event.screenX","screenX")}} / {{domxref("event.screenY","screenY")}}</code></code></li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/clienty/index.html b/files/zh-cn/web/api/mouseevent/clienty/index.html
new file mode 100644
index 0000000000..2c682695d9
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/clienty/index.html
@@ -0,0 +1,83 @@
+---
+title: MouseEvent.clientY
+slug: Web/API/MouseEvent/clientY
+tags:
+  - CSSOM View
+  - MouseEvent
+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="Return_value">Return value</h3>
+
+<p>被 CSSOM View Module 重新定义为一个 <code>double</code> 类型的浮点值. 原来这个属性是被定义为一个 <code>long</code> 整数. 可以在 "浏览器兼容性" 那里查看详细内容.</p>
+
+<h3 id="Example" name="Example">Example</h3>
+
+<pre class="brush: js">&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;clientX\clientY example&lt;/title&gt;
+
+&lt;script type="text/javascript"&gt;
+function showCoords(evt){
+  alert(
+    "clientX value: " + evt.clientX + "\n"
+    + "clientY value: " + evt.clientY + "\n"
+  );
+}
+&lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body onmousedown="showCoords(event)"&gt;
+&lt;p&gt;To display the mouse coordinates click anywhere on the page.&lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</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('CSSOM View','#dom-mouseevent-clienty', 'clientY')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td>Redefines {{domxref("MouseEvent")}} from <code>long</code> to <code>double</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Events','#widl-MouseEvent-clientY','MouseEvent.clientY')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>No change from {{SpecName('DOM2 Events')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.clientY')}}</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.clientY")}}</p>
+
+<h2 id="See_also" name="See_also">查看更多</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/zh-cn/web/api/mouseevent/ctrlkey/index.html b/files/zh-cn/web/api/mouseevent/ctrlkey/index.html
new file mode 100644
index 0000000000..183a6e61cd
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/ctrlkey/index.html
@@ -0,0 +1,121 @@
+---
+title: MouseEvent.ctrlKey
+slug: Web/API/MouseEvent/ctrlKey
+translation_of: Web/API/MouseEvent/ctrlKey
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><code><font face="Open Sans, arial, sans-serif">鼠标事件</font><strong>ctrlKey是只读属性，可返回一个布尔值，当ctrl键被按下，返回true，否则返回false</strong></code></p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <em>ctrlKeyPressed</em> = <em>instanceOfMouseEvent</em>.ctrlKey
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>A boolean</p>
+
+<h2 id="Example" name="Example">示例</h2>
+
+<pre class="brush: js">&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;ctrlKey example&lt;/title&gt;
+
+&lt;script type="text/javascript"&gt;
+
+function showChar(e){
+  alert(
+    "Key Pressed: " + String.fromCharCode(e.charCode) + "\n"
+    + "charCode: " + e.charCode + "\n"
+    + "CTRL key pressed: " + e.ctrlKey + "\n"
+  );
+}
+
+&lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body onkeypress="showChar(event);"&gt;
+&lt;p&gt;Press any character key, with or without holding down the CTRL key.&lt;br /&gt;
+You can also use the SHIFT key together with the CTRL key.&lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</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-ctrlKey','MouseEvent.ctrlKey')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>No change from {{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>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</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>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</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>{{ 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/zh-cn/web/api/mouseevent/getmodifierstate/index.html b/files/zh-cn/web/api/mouseevent/getmodifierstate/index.html
new file mode 100644
index 0000000000..c19bc41748
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/getmodifierstate/index.html
@@ -0,0 +1,55 @@
+---
+title: MouseEvent.getModifierState()
+slug: Web/API/MouseEvent/getModifierState
+translation_of: Web/API/MouseEvent/getModifierState
+---
+<p id="Summary">{{APIRef("DOM Events")}}</p>
+
+<p>The <strong><code>MouseEvent.getModifierState()</code></strong> method returns the current state of the specified modifier key: <code>true</code> if the modifier is active (i.e., the modifier key is pressed or locked), otherwise, <code>false</code>.</p>
+
+<p>See the document of {{domxref("KeyboardEvent.getModifierState","KeyboardEvent.getModifierState()")}} for details.</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <code><em>active</em> =​ <em>event</em>.getModifierState(<em>keyArg</em>);</code></pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>A {{jsxref("Boolean")}}</p>
+
+<h3 id="参数">参数</h3>
+
+<dl>
+ <dt><em><code>keyArg</code></em></dt>
+ <dd>A modifier key value. The value must be one of the {{domxref("KeyboardEvent.key")}} values which represent modifier keys or <code>"Accel"</code>. This is case-sensitive.</dd>
+</dl>
+
+<h2 id="规范"><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date#%E8%A7%84%E8%8C%83">规范</a></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-getModifierState', 'getModifierState()')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+
+
+<p>{{Compat("api.MouseEvent.getModifierState")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>The {{domxref("MouseEvent")}} this method belongs to.</li>
+ <li>{{domxref("KeyboardEvent.getModifierState")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/index.html b/files/zh-cn/web/api/mouseevent/index.html
new file mode 100644
index 0000000000..b6331ae58a
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/index.html
@@ -0,0 +1,182 @@
+---
+title: 鼠标事件
+slug: Web/API/MouseEvent
+translation_of: Web/API/MouseEvent
+---
+<p id="Summary">{{APIRef("DOM Events")}}</p>
+
+<p><strong><code>MouseEvent</code> </strong>接口指用户与指针设备( 如鼠标 )交互时发生的事件。使用此接口的常见事件包括：{{event("click")}}，{{event("dblclick")}}，{{event("mouseup")}}，{{event("mousedown")}}。</p>
+
+<p><code>MouseEvent</code> 派生自 {{domxref("UIEvent")}}，{{domxref("UIEvent")}} 派生自 {{domxref("Event")}}。虽然 <code>MouseEvent.initMouseEvent() </code>方法保持向后兼容性，但是应该使用 <code>MouseEvent()</code> 构造函数创建一个 <code>MouseEvent</code> 对象。</p>
+
+<p>一些具体的事件都派生自 <code>MouseEvent</code>：{{domxref("WheelEvent")}} 和{{domxref("DragEvent")}}。</p>
+
+<p>{{InheritanceDiagram}}</p>
+
+<h2 id="构造函数">构造函数</h2>
+
+<dl>
+ <dt>{{domxref("MouseEvent.MouseEvent", "MouseEvent()")}}</dt>
+ <dd>生成一个新的MouseEvent对象</dd>
+</dl>
+
+<h2 id="属性">属性</h2>
+
+<p><em>这个接口也继承了{{domxref("UIEvent")}} 和 {{domxref("Event")}}原型上的方法,</em></p>
+
+<dl>
+ <dt>{{domxref("MouseEvent.altKey")}} {{readonlyinline}}</dt>
+ <dd>当鼠标事件触发的时，如果<kbd>alt</kbd> 键被按下，返回true;</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>鼠标指针在点击元素（DOM）中的X坐标。</dd>
+ <dt>{{domxref("MouseEvent.clientY")}} {{readonlyinline}}</dt>
+ <dd>鼠标指针在点击元素（DOM）中的Y坐标。</dd>
+ <dt>{{domxref("MouseEvent.ctrlKey")}} {{readonlyinline}}</dt>
+ <dd>当鼠标事件触发时，如果 <kbd>control</kbd> 键被按下，则返回 true；</dd>
+ <dt>{{domxref("MouseEvent.metaKey")}} {{readonlyinline}}</dt>
+ <dd>当鼠标事件触发时，如果 <kbd>meta</kbd>键被按下，则返回 true；</dd>
+ <dt>{{domxref("MouseEvent.movementX")}} {{readonlyinline}}</dt>
+ <dd>鼠标指针相对于最后{{event("mousemove")}}事件位置的X坐标。</dd>
+ <dt>{{domxref("MouseEvent.movementY")}} {{readonlyinline}}</dt>
+ <dd>鼠标指针相对于最后{{event("mousemove")}}事件位置的Y坐标。</dd>
+</dl>
+
+<dl>
+ <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>
+</dl>
+
+<dl>
+ <dt>{{domxref("MouseEvent.region")}} {{readonlyinline}}</dt>
+ <dd>返回被点击事件影响的点击区域的id，如果没有区域被影响则返回null。</dd>
+ <dt>{{domxref("MouseEvent.relatedTarget")}} {{readonlyinline}}</dt>
+ <dd>
+ <p>鼠标事件的次要目标（如果有的话）</p>
+ </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>当鼠标事件触发时，如果 <kbd>shift</kbd> 键被按下，则返回 true；</dd>
+ <dt>{{domxref("MouseEvent.which")}} {{non-standard_inline}} {{readonlyinline}}</dt>
+ <dd>当鼠标事件触发时，表示被按下的按钮。</dd>
+ <dt>{{domxref("MouseEvent.mozPressure")}} {{non-standard_inline()}} {{readonlyinline}}</dt>
+ <dd>点击事件发生时施加在触摸屏或者平板设备的压力量。这个数值在0.0（最小压力）和1.0（最大压力）之间。</dd>
+ <dt>{{domxref("MouseEvent.mozInputSource")}} {{non-standard_inline()}} {{readonlyinline}}</dt>
+ <dd>生成事件的类型（若干 <code>MOZ_SOURCE_* </code>常量如下列出）。可通过该属性获知鼠标事件是否由真实鼠标设备触发，亦或通过触摸事件触发（这可能影响处理坐标事件时的精确程度）。</dd>
+ <dt>{{domxref("MouseEvent.webkitForce")}} {{non-standard_inline()}} {{readonlyinline}}</dt>
+ <dd>点击时施加的压力量。</dd>
+ <dt>{{domxref("MouseEvent.x")}} {{experimental_inline}}{{readonlyinline}}</dt>
+ <dd>{{domxref("MouseEvent.clientX")}}的别名。</dd>
+ <dt>{{domxref("MouseEvent.y")}} {{experimental_inline}}{{readonlyinline}}</dt>
+ <dd> {{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")}} 和{{domxref("Event")}}.</em></p>
+
+<dl>
+ <dt>{{domxref("MouseEvent.getModifierState()")}}</dt>
+ <dd>返回指定修饰键的当前状态。请参照{{domxref("KeyboardEvent.getModifierState")}}() 查看详情。</dd>
+ <dt>{{domxref("MouseEvent.initMouseEvent()")}} {{deprecated_inline}}</dt>
+ <dd>初始化创建MouseEvent的值。如果这个事件已经被分派，这个方法将不会做任何事情。</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">&lt;p&gt;&lt;label&gt;&lt;input type="checkbox" id="checkbox"&gt; Checked&lt;/label&gt;
+&lt;p&gt;&lt;button id="button"&gt;Click me&lt;/button&gt;</pre>
+
+<p>点击按钮查看演示：</p>
+
+<p>{{ EmbedLiveSample('示例', '', '', '') }}</p>
+
+<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('CSSOM View','#extensions-to-the-mouseevent-interface', 'MouseEvent')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td>Redefines <code>MouseEvent</code> from long to double. This means that a <code>PointerEvent</code> whose <code>pointerType</code> is mouse will be a double.</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. Redefined screen, page, client and coordinate (x and y) properties as <code>double</code> from <code>long</code>.</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>{{Compat("api.MouseEvent")}}</p>
+
+<h2 id="参考">参考</h2>
+
+<ul>
+ <li>它的直接父级，{{domxref("UIEvent")}}.</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/initmouseevent/index.html b/files/zh-cn/web/api/mouseevent/initmouseevent/index.html
new file mode 100644
index 0000000000..ffb87f8953
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/initmouseevent/index.html
@@ -0,0 +1,171 @@
+---
+title: MouseEvent.initMouseEvent()
+slug: Web/API/MouseEvent/initMouseEvent
+translation_of: Web/API/MouseEvent/initMouseEvent
+---
+<p>{{APIRef("DOM Events")}}{{deprecated_header}}</p>
+
+<p><code><strong>MouseEvent.initMouseEvent()</strong></code> 方法用以在鼠标事件创建时(一般用 {{domxref("Document.createEvent()")}}方法创建)初始化其属性的值。</p>
+
+<p>事件初始化是在事件被{{ domxref("Document.createEvent()") }}方法创建后必需的。这个方法必须在事件被{{ domxref("EventTarget.dispatchEvent()") }}方法发送出来前调用。一旦事件被发送后，它将不再起任何作用。 </p>
+
+<div class="note">
+<p><span style="font-size: 14px; line-height: 21px;"><strong>不要再用此方法，已过时。</strong></span></p>
+
+<p>使用特定的事件构造器来替代它，像 {{domxref("MouseEvent.MouseEvent", "MouseEvent()")}}。<a href="/en-US/docs/Web/Guide/Events/Creating_and_triggering_events">创建并发送事件</a> 页面里有更多的使用信息。</p>
+</div>
+
+<h2 id="Syntax" name="Syntax">语法</h2>
+
+<pre class="syntaxbox"><em>event</em>.initMouseEvent(<em>type</em>, <em>canBubble</em>, <em>cancelable</em>, <em>view</em>,
+<em>                     detail</em>, <em>screenX</em>, <em>screenY</em>, <em>clientX</em>, <em>clientY</em>,
+<em>                     ctrlKey</em>, <em>altKey</em>, <em>shiftKey</em>, <em>metaKey</em>,
+<em>                     button</em>, <em>relatedTarget</em>);</pre>
+
+<h3 id="形参">形参</h3>
+
+<dl>
+ <dt><em><code>type</code></em></dt>
+ <dd>设置事件类型{{domxref("Event.type", "type")}} 的字符串，包含以下几种鼠标事件：<code>click<font face="Open Sans, Arial, sans-serif">，</font></code><code>mousedown</code>，<code>mouseup</code>，<code>mouseover</code>，<code>mousemove</code>，<code>mouseout</code>。</dd>
+ <dt><em><code>canBubble</code></em></dt>
+ <dd>是否可以冒泡。取值集合见{{domxref("Event.bubbles")}}。</dd>
+ <dt><em><code>cancelable</code></em></dt>
+ <dd>是否可以阻止事件默认行为。取值集合见{{domxref("Event.cancelable")}}。</dd>
+ <dt><em><code>view</code></em></dt>
+ <dd>事件的AbstractView对象引用，这里其实指向{{domxref("window")}} 对象。取值集合见 {{domxref("UIEvent.view")}}。</dd>
+ <dt><em><code>detail</code></em></dt>
+ <dd>事件的鼠标点击数量。取值集合见{{domxref("Event.detail")}}。</dd>
+ <dt><em><code>screenX</code></em></dt>
+ <dd>事件的屏幕的x坐标。取值集合见{{domxref("MouseEvent.screenX")}}。</dd>
+ <dt><em><code>screenY</code></em></dt>
+ <dd>事件的屏幕的y坐标。取值集合见{{domxref("MouseEvent.screenY")}}。</dd>
+ <dt><em><code>clientX</code></em></dt>
+ <dd>事件的客户端x坐标。取值集合见{{domxref("MouseEvent.clientX")}}。</dd>
+ <dt><em><code>clientY</code></em></dt>
+ <dd>事件的客户端y坐标。取值集合见{{domxref("MouseEvent.clientY")}}。</dd>
+ <dt><em><code>ctrlKey</code></em></dt>
+ <dd>事件发生时 <kbd>control</kbd> 键是否被按下。取值集合见{{domxref("MouseEvent.ctrlKey")}}。</dd>
+ <dt><em><code>altKey</code></em></dt>
+ <dd>事件发生时 <kbd>alt</kbd> 键是否被按下。取值集合见{{domxref("MouseEvent.altKey")}}。</dd>
+ <dt><em><code>shiftKey</code></em></dt>
+ <dd>事件发生时 <kbd>shift</kbd> 键是否被按下。取值集合见{{domxref("MouseEvent.shiftKey")}}。</dd>
+ <dt><em><code>metaKey</code></em></dt>
+ <dd>事件发生时 <kbd>meta</kbd> 键是否被按下。取值集合见{{domxref("MouseEvent.metaKey")}}。</dd>
+ <dt><em><code>button</code></em></dt>
+ <dd>鼠标按键值 {{domxref("MouseEvent.button", "button")}}。</dd>
+ <dt><em><code>relatedTarget</code></em></dt>
+ <dd>事件的<a href="/en/DOM/event.relatedTarget" title="en/DOM/event.relatedTarget">相关对象</a>。只在某些事件类型有用 (例如 <code>mouseover</code> ?和 <code>mouseout</code>)。其它的传null。</dd>
+ <dt>
+ <p> </p>
+
+ <h2 id="Example" name="Example">?示例</h2>
+
+ <h3 id="HTML内容">HTML内容</h3>
+
+ <pre class="brush: html"><code>&lt;div style="background:red;width:180px;padding:10px;"&gt;
+ &lt;div id="out"&gt;&lt;/div&gt;
+ &lt;input type="text"&gt;
+&lt;/div&gt;</code>
+</pre>
+
+ <h3 id="JavaScript内容">JavaScript内容</h3>
+
+ <pre class="brush: js"><code>document.body.onclick = function(){
+ e = arguments[0];
+ var dt = e.target,stag = dt.tagName.toLowerCase();
+ </code>document.getElementById(<span class="highVAL">"out"</span>).innerHTML = <span class="highVAL">stag</span>;<code>
+};
+var simulateClick = function(){
+ var evt = document.createEvent("MouseEvents");
+ evt.initMouseEvent("click", true, true, window, 0, 0, 0, 80, 20, false, false, false, false, 0, null);
+ document.body.dispatchEvent(evt);
+}
+simulateClick();//Why it can not show "input" ?</code>
+</pre>
+
+ <p>这里有个在线演示</p>
+
+ <p>{{EmbedLiveSample('Example', 200, 36)}}</p>
+
+ <p>{{ LiveSampleLink('Example', 'Link to live demo') }}</p>
+ </dt>
+</dl>
+
+<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', '#idl-interface-MouseEvent-initializers', 'MouseEvent.initMouseEvent()')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>From {{SpecName('DOM2 Events')}}, deprecated.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events', '#Events-Event-initMouseEvent', 'MouseEvent.initMouseEvent()')}}</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>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</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>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="参阅">参阅</h2>
+
+<ul>
+ <li>{{domxref("MouseEvent.MouseEvent()","MouseEvent()")}}构造器，更标准的创建{{domxref("MouseEvent")}}对象方法。</li>
+ <li>{{domxref("Event.initEvent()")}}可以简单达到相同目的的方法。它已过时不再使用。</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/metakey/index.html b/files/zh-cn/web/api/mouseevent/metakey/index.html
new file mode 100644
index 0000000000..3857a4f284
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/metakey/index.html
@@ -0,0 +1,112 @@
+---
+title: MouseEvent.metaKey
+slug: Web/API/MouseEvent/metaKey
+translation_of: Web/API/MouseEvent/metaKey
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><strong><code>MouseEvent.metaKey</code></strong> 为只读属性，返回一个 {{jsxref("Boolean", "布尔值")}}，在鼠标事件发生时，用于指示 <kbd>Meta</kbd> 键是按下状态（<code>true</code>），还是释放状态（<code>false</code>）。</p>
+
+<div class="note">
+<p><strong>备注：</strong>在 MAC 键盘上，表示 Command 键（<kbd>⌘</kbd>），在 Windows键盘上，表示 Windows 键（<kbd>⊞</kbd>）。</p>
+</div>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var metaKeyPressed = <em>instanceOfMouseEvent</em>.metaKey
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>一个布尔值。</p>
+
+<h2 id="Example" name="Example">示例</h2>
+
+<pre class="brush: js"> function goInput(e) {
+ // 检测 metaKey 值
+   if (e.metaKey) {
+        // 继续处理事件
+     superSizeOutput(e);
+   } else {
+     doOutput(e);
+   }
+ }
+</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>No change from {{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>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</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>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</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>{{ 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/zh-cn/web/api/mouseevent/mouseevent/index.html b/files/zh-cn/web/api/mouseevent/mouseevent/index.html
new file mode 100644
index 0000000000..df7fd6c8c6
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/mouseevent/index.html
@@ -0,0 +1,184 @@
+---
+title: MouseEvent()
+slug: Web/API/MouseEvent/MouseEvent
+tags:
+  - API
+  - Constructor
+  - DOM
+  - MouseEvent
+  - 事件
+  - 构造器
+  - 鼠标
+  - 鼠标事件
+translation_of: Web/API/MouseEvent/MouseEvent
+---
+<p id="Summary">{{APIRef("DOM Events")}}</p>
+
+<p><strong><code>MouseEvent()</code></strong> 构造器创建一个 {{domxref("MouseEvent")}}。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox"> <em>event</em> = new MouseEvent(<em>typeArg</em>, <em>mouseEventInit</em>);</pre>
+
+<h3 id="形参">形参</h3>
+
+<dl>
+ <dt><em>typeArg</em></dt>
+ <dd>{{domxref("DOMString")}} 格式的事件名称。</dd>
+ <dt><em>mouseEventInit</em> {{optional_inline}}</dt>
+</dl>
+
+<dl>
+ <dd>初始化 <code>MouseEvent</code> 的字典，有下列属性字段：
+
+ <ul>
+  <li><code>"screenX"</code>，<code>long</code> 型可选，默认为 <code>0</code>，设置鼠标事件发生时相对于用户屏幕的水平坐标位置；该操作并不会改变真实鼠标的位置。</li>
+  <li><code>"screenY"</code>，<code>long</code> 型可选，默认为 <code>0</code>，设置鼠标事件发生时相对于用户屏幕的垂直坐标位置；该操作并不会改变真实鼠标的位置。</li>
+  <li><code>"clientX"</code>，<code>long</code> 型可选，默认为 <code>0</code>，设置鼠标事件时相对于客户端窗口的水平坐标位置；该操作并不会改变真实鼠标的位置。</li>
+  <li><code>"clientY"</code>，<code>long</code> 型可选，默认为 <code>0</code>，设置鼠标事件时相对于客户端窗口的垂直坐标位置；该操作并不会改变真实鼠标的位置。</li>
+  <li><code>"ctrlKey"</code>，{{jsxref("Boolean")}} 型可选，默认为<code>false</code>，标明是否同时按下 <kbd>ctrl</kbd> 键。</li>
+  <li><code>"shiftKey"</code>，{{jsxref("Boolean")}} 型可选，默认为<code>false</code>，标明是否同时按下 <kbd>shift</kbd> 键。</li>
+  <li><code>"altKey"</code>，{{jsxref("Boolean")}} 型可选，默认为 <code>false</code>，标明是否同时按下 <kbd>alt</kbd> 键。</li>
+  <li><code>"metaKey"</code>，{{jsxref("Boolean")}} 型可选，默认为<code>false</code>，标明是否同时按下 <kbd>meta</kbd> 键。</li>
+  <li><code>"button"</code>，<code>short</code> 型可选，默认为 <code>0</code>，描述了当事件发生时，哪个按键被按下或释放：
+   <table class="standard-table">
+    <thead>
+     <tr>
+      <th scope="col">值</th>
+      <th scope="col">含义</th>
+     </tr>
+    </thead>
+    <tbody>
+     <tr>
+      <td><code>0</code></td>
+      <td>主按键被按下（通常为左键）或未初始化</td>
+     </tr>
+     <tr>
+      <td><code>1</code></td>
+      <td>辅助按键被按下 (通常为中键)</td>
+     </tr>
+     <tr>
+      <td><code>2</code></td>
+      <td>次按键被按下 (通常为右键)</td>
+     </tr>
+    </tbody>
+   </table>
+  </li>
+  <li><code>"buttons"</code>，无符号 <code>short</code> 型可选，默认为 <code>0</code>，描述了当事件发生时哪些按键被按下：
+   <table class="standard-table">
+    <thead>
+     <tr>
+      <th scope="col">位域值<br>
+       （Bit-field value）</th>
+      <th scope="col">含义</th>
+     </tr>
+    </thead>
+    <tbody>
+     <tr>
+      <td><code>0</code></td>
+      <td>无按键被按下</td>
+     </tr>
+     <tr>
+      <td><code>1</code></td>
+      <td>主按键被按下 (通常为左键)</td>
+     </tr>
+     <tr>
+      <td><code>2</code></td>
+      <td>次按键被按下 (通常为右键)</td>
+     </tr>
+     <tr>
+      <td><code>4</code></td>
+      <td>辅助按键被按下 (通常为中键)</td>
+     </tr>
+    </tbody>
+   </table>
+  </li>
+  <li><code>"relatedTarget"</code>，{{domxref("EventTarget")}} 型可选，默认为 <code>null</code>，若事件为 {{event("mouseenter")}} 或 {{event("mouseover")}}，则表示刚离开的元素；若事件为 {{event("mouseout")}} 或 {{event("mouseleave")}}，则表示刚进入的元素。</li>
+  <li><code>"region"</code>，{{domxref("DOMString")}} 型可选，默认为<code>null</code>，标明点击事件影响的区域 DOM 的 id。不影响任何区域的话，请传<code>null</code>值。</li>
+ </ul>
+
+ <p>在一些实现中，passing anything other than a number for the screen and client fields will throw a <code>TypeError</code>.</p>
+
+ <div class="note">
+ <p><em>上述 <code>MouseEventInit</code></em><em> 字典字段还包括从 {{domxref("UIEvent.UIEvent", "UIEventInit")}} 和 {{domxref("Event.Event", "EventInit")}} 继承来的字典字段。</em></p>
+ </div>
+ </dd>
+</dl>
+
+<h2 id="Specifications" name="Specifications">规范</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("HTML WHATWG", "#dom-mouseevent-region", 'region value')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>From {{SpecName('DOM3 Events')}}, added the <code>"region"</code> value in the dictionary.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Events','#interface-MouseEvent','MouseEvent()')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+
+
+<p>{{Compat("api.MouseEvent.MouseEvent")}}</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>You can polyfill the <code>MouseEvent()</code> constructor functionality in Internet Explorer 9 and higher with the following code:</p>
+
+<pre class="brush: js">(function (window) {
+  try {
+    new MouseEvent('test');
+    return false; // No need to polyfill
+  } catch (e) {
+		// Need to polyfill - fall through
+  }
+
+    // Polyfills 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);
+</pre>
+
+<h2 id="参见">参见</h2>
+
+<ul>
+ <li>{{domxref("MouseEvent")}}，对象结构接口。</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/movementx/index.html b/files/zh-cn/web/api/mouseevent/movementx/index.html
new file mode 100644
index 0000000000..084428207d
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/movementx/index.html
@@ -0,0 +1,103 @@
+---
+title: MouseEvent.movementX
+slug: Web/API/MouseEvent/movementX
+translation_of: Web/API/MouseEvent/movementX
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p> <strong><code>MouseEvent.movementX</code></strong> 是只读属性，它提供了当前事件和上一个{{event("mousemove")}}事件之间鼠标在水平方向上的移动值。换句话说，这个值是这样计算的 : <code>currentEvent.movementX = currentEvent.screenX - previousEvent.screenX</code>.</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <em>xShift</em> = <em>instanceOfMouseEvent</em>.movementX
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>一个数字</p>
+
+<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('Pointer Lock','#widl-MouseEvent-movementX','MouseEvent.movementX')}}</td>
+   <td>{{Spec2('Pointer Lock')}}</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>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(22.0)}} {{property_prefix("webkit")}}<br>
+    {{CompatChrome(37.0)}} unprefixed</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>
+    <p>{{CompatGeckoDesktop(1.0)}} {{property_prefix("moz")}}<br>
+     {{CompatGeckoDesktop(41)}}</p>
+   </td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatUnknown() }}</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>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(37)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile(1.0)}} {{property_prefix("moz")}}<br>
+    {{CompatGeckoMobile(41)}}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{CompatVersionUnknown}} {{property_prefix("webkit")}}<br>
+    {{CompatChrome(37.0)}} unprefixed</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">相关</h2>
+
+<ul>
+ <li>{{ domxref("MouseEvent") }}</li>
+ <li><a href="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock</a></li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/movementy/index.html b/files/zh-cn/web/api/mouseevent/movementy/index.html
new file mode 100644
index 0000000000..1faaccff17
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/movementy/index.html
@@ -0,0 +1,101 @@
+---
+title: MouseEvent.movementY
+slug: Web/API/MouseEvent/movementY
+translation_of: Web/API/MouseEvent/movementY
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><strong><code>MouseEvent.movementY</code> </strong>是只读属性，它提供了当前事件和上一个 {{event("mousemove")}} 事件之间鼠标在水平方向上的移动值。换句话说，这个值是这样计算的 :<code>currentEvent.movementY = currentEvent.screenY - previousEvent.screenY</code>.</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <em>yShift</em> = <em>instanceOfMouseEvent</em>.movementY
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>A number</p>
+
+<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('Pointer Lock','#widl-MouseEvent-movementY','MouseEvent.movementY')}}</td>
+   <td>{{Spec2('Pointer Lock')}}</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>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(22.0)}} {{property_prefix("webkit")}}<br>
+    {{CompatChrome(37.0)}} unprefixed</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop(1.0)}} {{property_prefix("moz")}}<br>
+    {{CompatGeckoDesktop(41)}}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatUnknown() }}</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>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(37.0)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile(1.0)}} {{property_prefix("moz")}}<br>
+    {{CompatGeckoMobile(41)}}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{CompatVersionUnknown}} {{property_prefix("webkit")}}<br>
+    {{CompatChrome(37.0)}} unprefixed</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="相关">相关</h2>
+
+<ul>
+ <li>{{ domxref("MouseEvent") }}</li>
+ <li><a href="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock</a></li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/mozinputsource/index.html b/files/zh-cn/web/api/mouseevent/mozinputsource/index.html
new file mode 100644
index 0000000000..bb4e530ced
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/mozinputsource/index.html
@@ -0,0 +1,71 @@
+---
+title: MouseEvent.mozInputSource
+slug: Web/API/MouseEvent/mozInputSource
+tags:
+  - API
+translation_of: Web/API/MouseEvent/mozInputSource
+---
+<p>{{ APIRef() }}</p>
+
+<p>{{ gecko_minversion_header("2.0") }}</p>
+
+<p>{{ Non-standard_header() }}</p>
+
+<p>{{domxref("MouseEvent")}}中的<strong><code>MouseEvent.mozInputSource</code></strong>是只读属性，它提供触发事件的设备信息。例如，当一个鼠标事件发生时，你能根据<strong><code>MouseEvent.mozInputSource</code></strong>属性判断该事件是由鼠标还是由触屏设备触发的（这将影响到你对于事件发生坐标解释的精确度）。</p>
+
+<h2 id="Syntax" name="Syntax">语法</h2>
+
+<pre class="syntaxbox"><em>var source</em> = event.mozInputSource;</pre>
+
+<h3 id="值">值</h3>
+
+<p>下列值都是合法的</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>常量名称</th>
+   <th>值</th>
+   <th>描述</th>
+  </tr>
+  <tr>
+   <td><code>MOZ_SOURCE_UNKNOWN</code></td>
+   <td>0</td>
+   <td>该事件是由未知设备触发的。</td>
+  </tr>
+  <tr>
+   <td><code>MOZ_SOURCE_MOUSE</code></td>
+   <td>1</td>
+   <td>该事件是由鼠标（或类似的设备）触发的。</td>
+  </tr>
+  <tr>
+   <td><code>MOZ_SOURCE_PEN</code></td>
+   <td>2</td>
+   <td>该事件是由触屏笔在写字板上触发的。</td>
+  </tr>
+  <tr>
+   <td><code>MOZ_SOURCE_ERASER</code></td>
+   <td>3</td>
+   <td>该事件是由触屏橡皮擦在写字板上触发的。</td>
+  </tr>
+  <tr>
+   <td><code>MOZ_SOURCE_CURSOR</code></td>
+   <td>4</td>
+   <td>该事件是由指针触发的。</td>
+  </tr>
+  <tr>
+   <td><code>MOZ_SOURCE_TOUCH</code></td>
+   <td>5</td>
+   <td>该事件是在触屏设备上触发的。</td>
+  </tr>
+  <tr>
+   <td><code>MOZ_SOURCE_KEYBOARD</code></td>
+   <td>6</td>
+   <td>该事件是由键盘触发的。</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Specification" name="Specification">详述</h2>
+
+<p>无</p>
diff --git a/files/zh-cn/web/api/mouseevent/offsetx/index.html b/files/zh-cn/web/api/mouseevent/offsetx/index.html
new file mode 100644
index 0000000000..28c6719863
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/offsetx/index.html
@@ -0,0 +1,120 @@
+---
+title: MouseEvent.offsetX
+slug: Web/API/MouseEvent/offsetX
+tags:
+  - API
+  - 只读
+  - 属性
+  - 鼠标事件
+translation_of: Web/API/MouseEvent/offsetX
+---
+<p>{{APIRef("DOM Events")}}{{SeeCompatTable}}</p>
+
+<p>{{domxref("MouseEvent")}} 接口的只读属性 <strong>offsetX </strong>规定了事件对象与目标节点的内填充边（padding edge）在 X 轴方向上的偏移量。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var xOffset = <em>instanceOfMouseEvent</em>.offsetX;
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>一个<code>双精度</code> 浮点值。早期的规范将其规定为整数值。详见浏览器兼容性部分。</p>
+
+<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('CSSOM View', '#dom-mouseevent-offsetx', 'MouseEvent')}}</td>
+   <td>{{Spec2('CSSOM View')}}</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>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>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("39.0")}}</td>
+   <td>6</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">
+<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>{{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>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>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">相关内容</h2>
+
+<ul>
+ <li>{{ domxref("MouseEvent") }}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/offsety/index.html b/files/zh-cn/web/api/mouseevent/offsety/index.html
new file mode 100644
index 0000000000..7b1eab0450
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/offsety/index.html
@@ -0,0 +1,119 @@
+---
+title: MouseEvent.offsetY
+slug: Web/API/MouseEvent/offsetY
+tags:
+  - API
+  - 只读属性
+  - 鼠标事件
+translation_of: Web/API/MouseEvent/offsetY
+---
+<p>{{APIRef("DOM Events")}}{{SeeCompatTable}}</p>
+
+<p>MouseEvent 接口的只读属性 <strong>offsetY </strong>规定了事件对象与目标节点的内填充边（padding edge）在 Y 轴方向上的偏移量。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var yOffset = <em>instanceOfMouseEvent</em>.offsetY;
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>一个<code>双精度</code> 浮点值。早期的规范将其规定为整数值。详见浏览器兼容性部分。</p>
+
+<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('CSSOM View', '#dom-mouseevent-offsety', 'MouseEvent')}}</td>
+   <td>{{Spec2('CSSOM View')}}</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>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>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("39.0")}}</td>
+   <td>6</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">
+<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>{{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>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>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">相关内容</h2>
+
+<ul>
+ <li>{{ domxref("MouseEvent") }}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/pagex/index.html b/files/zh-cn/web/api/mouseevent/pagex/index.html
new file mode 100644
index 0000000000..06e933334d
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/pagex/index.html
@@ -0,0 +1,126 @@
+---
+title: MouseEvent.pageX
+slug: Web/API/MouseEvent/pageX
+translation_of: Web/API/MouseEvent/pageX
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p> <code><strong>pageX</strong></code> 是一个由{{domxref("MouseEvent")}}接口返回的相对于整个文档的x（水平）坐标以像素为单位的只读属性。</p>
+
+<p>这个属性将基于文档的边缘，考虑任何页面的水平方向上的滚动。举个例子，如果页面向右滚动 200px 并出现了滚动条，这部分在窗口之外，然后鼠标点击距离窗口左边 100px 的位置，pageX 所返回的值将是 300。</p>
+
+<p> 起初这个属性被定义为长整型。 CSSOM 视图模块将它重新定位为双浮点数类型。请参阅浏览器兼容性部分了解详情。</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;</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="参考">参考</h2>
+
+<ul>
+ <li>{{domxref("UIEvent.pageX")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/pagey/index.html b/files/zh-cn/web/api/mouseevent/pagey/index.html
new file mode 100644
index 0000000000..22a862d9eb
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/pagey/index.html
@@ -0,0 +1,122 @@
+---
+title: MouseEvent.pageY
+slug: Web/API/MouseEvent/pageY
+translation_of: Web/API/MouseEvent/pageY
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><code><strong>pageY</strong></code>是一个只读属性，它返回触发事件的位置相对于整个 document 的 Y 坐标值。由于其参考物是整个 dom，所以这个值受页面垂直方向的滚动影响。例如：当你垂直方向向下滚动了 50 pixel，那么你在顶端进行点击的时候，获取的<code><strong>pageY</strong></code>为 50pixed 而不是 0。最初这个属性被定义为长整型（long integer），如今 <strong>CSSOM </strong>视图模块将其重新定义为双精度浮点数（double float）。你可以查阅浏览器兼容性部分的文档来进一步了解有关信息。</p>
+
+<h2 id="Syntax" name="Syntax">语法</h2>
+
+<pre class="syntaxbox">var <em>pos</em> = <em>event</em>.pageY</pre>
+
+<h2 id="Syntax" name="Syntax">示例</h2>
+
+<pre><em>var pageY</em> = <em>event</em>.pageY;</pre>
+
+<h3 id="规范">规范</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Specification</th>
+   <th>Status</th>
+   <th>Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSSOM View', '#dom-mouseevent-pagey', 'pageY')}}</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-pagey', 'pageY')}}</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)}}</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.)}}</td>
+   <td>{{CompatChrome(45)}}</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="更多请见">更多请见</h2>
+
+<ul>
+ <li>{{domxref("UIEvent.pageY")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/region/index.html b/files/zh-cn/web/api/mouseevent/region/index.html
new file mode 100644
index 0000000000..15bdf83f92
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/region/index.html
@@ -0,0 +1,56 @@
+---
+title: MouseEvent.region
+slug: Web/API/MouseEvent/region
+tags:
+  - API
+  - Canvas
+  - DOM Events
+  - MouseEvent
+translation_of: Web/API/MouseEvent/region
+---
+<div>{{APIRef("DOM Events")}}</div>
+
+<p>The <strong><code>MouseEvent.region</code></strong> read-only property returns the id of the <a href="/en-US/docs/Web/API/CanvasRenderingContext2D.addHitRegion">canvas hit region</a> affected by the event. If no hit region is affected, <code>null</code> is returned.</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <em>hitRegion</em> = <em>instanceOfMouseEvent</em>.region
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>A {{domxref("DOMString")}} representing the id of the hit region.</p>
+
+<h2 id="例子">例子</h2>
+
+<pre class="brush: html">&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
+
+&lt;script&gt;
+var canvas = document.getElementById("canvas");
+var ctx = canvas.getContext("2d");
+
+ctx.beginPath();
+ctx.arc(70, 80, 10, 0, 2 * Math.PI, false);
+ctx.fill();
+ctx.addHitRegion({id: "circle"});
+
+canvas.addEventListener("mousemove", function(event){
+  if(event.region) {
+    console.log("hit region: " + event.region);
+  }
+});
+&lt;/script&gt;
+</pre>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+
+
+<p>{{Compat("api.MouseEvent.region")}}</p>
+
+<h2 id="更多参考">更多参考</h2>
+
+<ul>
+ <li>{{domxref("MouseEvent")}}</li>
+ <li>{{domxref("CanvasRenderingContext2D.addHitRegion()")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/relatedtarget/index.html b/files/zh-cn/web/api/mouseevent/relatedtarget/index.html
new file mode 100644
index 0000000000..a184a8a2f3
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/relatedtarget/index.html
@@ -0,0 +1,169 @@
+---
+title: MouseEvent.relatedTarget
+slug: Web/API/MouseEvent/relatedTarget
+translation_of: Web/API/MouseEvent/relatedTarget
+---
+<div>{{APIRef("DOM Events")}}</div>
+
+<div>只读属性<strong><code>MouseEvent.relatedTarget</code></strong> 是鼠标事件的次要目标（如果存在），它包括：</div>
+
+<table class="standard-table" style="width: auto;">
+ <tbody>
+  <tr>
+   <td class="header">事件名称</td>
+   <td class="header"><code>target</code></td>
+   <td class="header"><code>relatedTarget</code></td>
+  </tr>
+  <tr>
+   <td>{{Event("focusin")}}</td>
+   <td>{{domxref("EventTarget")}} 获取焦点</td>
+   <td>{{domxref("EventTarget")}} 失去焦点</td>
+  </tr>
+  <tr>
+   <td>{{Event("focusout")}}</td>
+   <td>{{domxref("EventTarget")}} 失去焦点</td>
+   <td>The {{domxref("EventTarget")}} 获取焦点</td>
+  </tr>
+  <tr>
+   <td>{{Event("mouseenter")}}</td>
+   <td>指针设备进入{{domxref("EventTarget")}}</td>
+   <td>指针设备离开{{domxref("EventTarget")}}</td>
+  </tr>
+  <tr>
+   <td>{{Event("mouseleave")}}</td>
+   <td>指针设备离开 {{domxref("EventTarget")}}</td>
+   <td>指针设备进入 {{domxref("EventTarget")}}</td>
+  </tr>
+  <tr>
+   <td>{{Event("mouseout")}}</td>
+   <td>指针设备离开 {{domxref("EventTarget")}}</td>
+   <td>The {{domxref("EventTarget")}}</td>
+  </tr>
+  <tr>
+   <td>{{Event("mouseover")}}</td>
+   <td>指针设备进入 {{domxref("EventTarget")}}</td>
+   <td>指针设备离开 {{domxref("EventTarget")}}</td>
+  </tr>
+  <tr>
+   <td>{{Event("dragenter")}}</td>
+   <td>指针设备进入 {{domxref("EventTarget")}}</td>
+   <td>指针设备离开 {{domxref("EventTarget")}}</td>
+  </tr>
+  <tr>
+   <td>{{Event("dragexit")}}</td>
+   <td>指针设备离开 {{domxref("EventTarget")}}</td>
+   <td>指针设备进入 {{domxref("EventTarget")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>如果事件没有次要目标，<code>relatedTarget</code> 将返回 <code>null</code>.</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var <em>target</em> = <em>instanceOfMouseEvent</em>.relatedTarget
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p> {{domxref("EventTarget")}} 对象或者 <code>null</code>.</p>
+
+<h2 id="示例">示例</h2>
+
+<p>尝试将你的鼠标移入移出红色和蓝色方块。</p>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;body id="body"&gt;
+  &lt;div id="outer"&gt;
+    &lt;div id="red"&gt;&lt;/div&gt;
+    &lt;div id="blue"&gt;&lt;/div&gt;
+  &lt;/div&gt;
+  &lt;p id="log"&gt;&lt;/p&gt;
+&lt;/body&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">#outer {
+  width: 250px;
+  height: 125px;
+  display: flex;
+}
+
+#red {
+  flex-grow: 1;
+  background: red;
+}
+
+#blue {
+  flex-grow: 1;
+  background: blue;
+}
+
+#log {
+  max-height: 120px;
+  overflow-y: scroll;
+}</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="brush: js">const mouseoutLog = document.getElementById('log'),
+      red = document.getElementById('red'),
+      blue = document.getElementById('blue');
+
+red.addEventListener('mouseover', overListener);
+red.addEventListener('mouseout', outListener);
+blue.addEventListener('mouseover', overListener);
+blue.addEventListener('mouseout', outListener);
+
+function outListener(event) {
+  let related = event.relatedTarget ? event.relatedTarget.id : "unknown";
+
+  mouseoutLog.innerText = `\nfrom ${event.target.id} into ${related} ${mouseoutLog.innerText}`;
+}
+
+function overListener(event) {
+  let related = event.relatedTarget ? event.relatedTarget.id : "unknown";
+
+  log.innerText = `\ninto ${event.target.id} from ${related} ${mouseoutLog.innerText}`;
+}
+</pre>
+
+<h3 id="Result">Result</h3>
+
+<p>{{EmbedLiveSample("Example", 700, 280)}}</p>
+
+<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-relatedTarget','MouseEvent.relatedTarget')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>No change from {{SpecName('DOM2 Events')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.altkey')}}</td>
+   <td>{{Spec2('DOM2 Events')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+
+
+<p>{{Compat("api.MouseEvent.relatedTarget")}}</p>
+
+<h2 id="另见">另见</h2>
+
+<ul>
+ <li>{{ domxref("MouseEvent") }}</li>
+ <li><a href="/en-US/docs/DOM/event/Comparison_of_Event_Targets" title="DOM/event/Comparison_of_Event_Targets">Comparison of Event Targets</a></li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/screenx/index.html b/files/zh-cn/web/api/mouseevent/screenx/index.html
new file mode 100644
index 0000000000..1f3f484d14
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/screenx/index.html
@@ -0,0 +1,92 @@
+---
+title: MouseEvent.screenX
+slug: Web/API/MouseEvent/screenX
+tags:
+  - API
+  - MouseEvent
+  - Property
+  - events
+  - 事件
+  - 参考
+  - 属性
+  - 鼠标
+  - 鼠标事件
+translation_of: Web/API/MouseEvent/screenX
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><span class="seoSummary"> <strong><code>screenX</code></strong> 是 {{domxref("MouseEvent")}} 的只读属性，提供鼠标在全局（屏幕）中的水平坐标（偏移量）。</span></p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox notranslate">var <em>pixelNumber</em> = <em>instanceOfMouseEvent</em>.screenX
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>一个双精度浮点值。早期版本的规范将该值定义为整数值的像素数。有关详细信息，请参见浏览器兼容性部分。</p>
+
+<h2 id="示例">示例</h2>
+
+<p>这个例子展示了当触发 {{Event("mousemove")}} 事件时鼠标的坐标。</p>
+
+<h4 id="HTML">HTML</h4>
+
+<pre class="notranslate">&lt;p&gt;Move your mouse to see its position.&lt;/p&gt;
+&lt;p id="screen-log"&gt;&lt;/p&gt;</pre>
+
+<h4 id="JavaScript">JavaScript</h4>
+
+<pre class="notranslate">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><iframe class="live-sample-frame sample-code-frame" frameborder="0" id="frame_Example" src="https://mdn.mozillademos.org/en-US/docs/Web/API/MouseEvent/screenX$samples/Example?revision=1510648"></iframe></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-screenx', 'screenX')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td>Redefines {{domxref("MouseEvent")}} from long to double. </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Events','#widl-MouseEvent-screenX','MouseEvent.screenX')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>No change from {{SpecName('DOM2 Events')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.sceenX')}}</td>
+   <td>{{Spec2('DOM2 Events')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+<p>{{Compat("api.MouseEvent.screenX")}}</p>
+
+<h2 id="参见"><span>参见</span></h2>
+
+<div id="compat-mobile"></div>
+
+<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/zh-cn/web/api/mouseevent/screeny/index.html b/files/zh-cn/web/api/mouseevent/screeny/index.html
new file mode 100644
index 0000000000..4ae5210e23
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/screeny/index.html
@@ -0,0 +1,136 @@
+---
+title: MouseEvent.screenY
+slug: Web/API/MouseEvent/screenY
+tags:
+  - API
+  - 参考
+  - 属性
+  - 鼠标
+  - 鼠标事件
+translation_of: Web/API/MouseEvent/screenY
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p> <strong><code>screenX</code></strong> 是 <a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/API/MouseEvent"><code>MouseEvent</code></a> 的只读属性，提供鼠标在全局（屏幕）中的水平坐标（偏移量）。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox notranslate">var <em>pixelNumber</em> = <em>instanceOfMouseEvent</em>.screenY
+</pre>
+
+<h3 id="返回值">返回值</h3>
+
+<p>一个<code>double</code>值。早期版本的规范定义将其一个整数值的像素数。有关详细信息，请参见浏览器兼容性部分。</p>
+
+<h2 id="示例">示例</h2>
+
+<p>这个例子展示了当触发 {{Event("mousemove")}} 事件时鼠标的坐标。</p>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="notranslate">&lt;p&gt;Move your mouse to see its position.&lt;/p&gt;
+&lt;p id="screen-log"&gt;&lt;/p&gt;</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="notranslate">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>
+
+<h3 id="结果">结果</h3>
+
+<p><iframe class="live-sample-frame sample-code-frame" frameborder="0" id="frame_Example" src="https://mdn.mozillademos.org/en-US/docs/Web/API/MouseEvent/screenY$samples/Example?revision=1510695"></iframe></p>
+
+<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('CSSOM View','#dom-mouseevent-screeny', 'screenY')}}</td>
+   <td>{{Spec2('CSSOM View')}}</td>
+   <td>Redefines {{domxref("MouseEvent")}} from long to double. </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Events','#widl-MouseEvent-screenY','MouseEvent.screenY')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>No change from {{SpecName('DOM2 Events')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events','#Events-MouseEvent','MouseEvent.sceenY')}}</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>6</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>{{CompatVersionUnknown()}}</td>
+   <td>{{CompatVersionUnknown()}}</td>
+   <td>{{CompatVersionUnknown()}}</td>
+   <td>{{CompatVersionUnknown()}}</td>
+   <td>{{CompatVersionUnknown()}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">参见</h2>
+
+<ul>
+ <li>{{ domxref("MouseEvent") }}</li>
+ <li>{{ domxref("MouseEvent.screenX","screenX") }}</li>
+ <li>{{ domxref("MouseEvent.clientX","clientX") }} / {{ domxref("MouseEvent.clientY", "clientY") }}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/shiftkey/index.html b/files/zh-cn/web/api/mouseevent/shiftkey/index.html
new file mode 100644
index 0000000000..a31ab83fb1
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/shiftkey/index.html
@@ -0,0 +1,127 @@
+---
+title: MouseEvent.shiftKey
+slug: Web/API/MouseEvent/shiftKey
+translation_of: Web/API/MouseEvent/shiftKey
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p><code><strong>MouseEvent.shiftKey</strong></code> 是只读属性，指出触发鼠标事件时是否按住了 <code>shift</code> 键</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <em>shiftKeyPressed</em> = <em>instanceOfMouseEvent</em>.shiftKey
+</pre>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>A boolean</p>
+
+<h2 id="Example" name="Example">Example</h2>
+
+<pre class="brush: js">&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;shiftKey example&lt;/title&gt;
+
+&lt;script type="text/javascript"&gt;
+
+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"
+  );
+}
+
+&lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body onkeypress="showChar(event);"&gt;
+&lt;p&gt;Press any character key, with or without holding down
+ the SHIFT key.&lt;br /&gt;
+You can also use the SHIFT key together with the ALT key.&lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Specifications">Specifications</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">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">See also</h2>
+
+<ul>
+ <li>{{ domxref("MouseEvent") }}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/which/index.html b/files/zh-cn/web/api/mouseevent/which/index.html
new file mode 100644
index 0000000000..591412dda3
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/which/index.html
@@ -0,0 +1,99 @@
+---
+title: MouseEvent.which
+slug: Web/API/MouseEvent/which
+tags:
+  - API
+  - 只读
+  - 非标准
+  - 鼠标事件
+translation_of: Web/API/MouseEvent/which
+---
+<p>{{APIRef("DOM Events")}}</p>
+
+<p>{{Non-standard_header}}</p>
+
+<p>只读属性 <strong>MouseEvent.which</strong> 显示了鼠标事件是由哪个鼠标按键被按下所触发的。其他获得该信息的标准属性是 {{ domxref("MouseEvent.button") }} 与 {{ domxref("MouseEvent.buttons") }} 。</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">var buttonPressed = instanceOfMouseEvent.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>如果鼠标被设置为适用于左利手人士使用，那么引发的动作恰好相反。在这种情况下，该值应该从右往左看。</p>
+
+<h2 id="规范">规范</h2>
+
+<p>无规范定义该属性。</p>
+
+<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>{{CompatGeckoDesktop(1)}}<sup>[1]</sup></td>
+   <td>1.0</td>
+   <td>9.0</td>
+   <td>5.0</td>
+   <td>1.0</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>{{ CompatGeckoMobile(1) }} [1]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] 在 {{event("mousemove")}} 事件对象上， <code>which</code> 属性被错误地设定为 <code>1</code> {{bug(1048294)}}.</p>
+
+<h2 id="See_also" name="See_also">相关内容</h2>
+
+<ul>
+ <li>{{ domxref("MouseEvent") }}</li>
+</ul>
diff --git a/files/zh-cn/web/api/mouseevent/x/index.html b/files/zh-cn/web/api/mouseevent/x/index.html
new file mode 100644
index 0000000000..bd2e29dd21
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/x/index.html
@@ -0,0 +1,79 @@
+---
+title: MouseEvent.x
+slug: Web/API/MouseEvent/x
+translation_of: Web/API/MouseEvent/x
+---
+<div>{{APIRef}}{{SeeCompatTable}}</div>
+
+<p><strong><code>MouseEvent.x</code></strong> 是 {{domxref("MouseEvent.clientX")}} 属性的别名.</p>
+
+<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('CSSOM View', '#dom-mouseevent-x', 'MouseEvent.x')}}</td>
+   <td>{{Spec2('CSSOM View')}}</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(53)}}</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>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>{{CompatGeckoMobile(53)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/zh-cn/web/api/mouseevent/y/index.html b/files/zh-cn/web/api/mouseevent/y/index.html
new file mode 100644
index 0000000000..e7dfc7bd85
--- /dev/null
+++ b/files/zh-cn/web/api/mouseevent/y/index.html
@@ -0,0 +1,83 @@
+---
+title: MouseEvent.y
+slug: Web/API/MouseEvent/y
+tags:
+  - API
+  - 只读属性
+  - 鼠标事件
+translation_of: Web/API/MouseEvent/y
+---
+<p>{{APIRef}}{{SeeCompatTable}}</p>
+
+<p><strong><code>MouseEvent.y</code></strong> 属性是 {{domxref("MouseEvent.clientY")}} 属性的别称。</p>
+
+<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('CSSOM View', '#dom-mouseevent-y', 'MouseEvent.y')}}</td>
+   <td>{{Spec2('CSSOM View')}}</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(53)}}</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>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>{{CompatGeckoMobile(53)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>