mozilla

Revision 297964 of WheelEvent

  • Revision slug: DOM/WheelEvent
  • Revision title: WheelEvent
  • Revision id: 297964
  • Created:
  • Creator: Masayuki
  • Is current revision? No
  • Comment

Revision Content

{{ IFSummary("dom/interfaces/events/nsIDOMWheelEvent.idl", "nsIDOMWheelEvent", "Scriptable", "17.0", "An event interface for mouse wheel events", "17.0") }}

The DOM WheelEvent represents events that occur due to the user moving a mouse wheel or similar input device.

This is really different event object from {{ domxref("MouseWheelEvent") }}.

Attributes

Attribute Type Description
deltaX float Horizontal scroll amount. Read only.
deltaY float Vertical scroll amount. Read only.
deltaZ float Scroll amount for the z-axis. Read only.
deltaMode unsigned long Unit of delta values. See {{ anch("Delta modes") }} for a list of permitted values. Read only.

Constants

Delta modes

Constant Value Description
DOM_DELTA_PIXEL 0x00 The delta values are specified in pixels.
DOM_DELTA_LINE 0x01 The delta values are specified in lines.
DOM_DELTA_PAGE 0x02 The delta values are specified in pages.

Browser compatibility

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support {{ CompatNo() }} {{ CompatGeckoDesktop("17.0") }} {{ CompatIE("9.0") }} {{ CompatNo() }} {{ CompatNo() }}
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support {{ CompatUnknown() }} {{ CompatGeckoMobile("17.0") }} {{ CompatUnknown() }} {{ CompatUnknown() }} {{ CompatUnknown() }}

See also

  • {{ domeventxref("wheel") }}
  • Non-gecko browsers' legacy mosue wheel event object: {{ domxref("MouseWheelEvent") }}

Revision Source

<p>{{ IFSummary("dom/interfaces/events/nsIDOMWheelEvent.idl", "nsIDOMWheelEvent", "Scriptable", "17.0", "An event interface for mouse wheel events", "17.0") }}</p>
<p>The DOM <code>WheelEvent</code> represents events that occur due to the user moving a mouse wheel or similar input device.</p>
<div class="note">
  <p>This is really different event object from {{ domxref("MouseWheelEvent") }}.</p>
</div>
<h2 id="Attributes">Attributes</h2>
<table class="standard-table">
  <tbody>
    <tr>
      <td class="header">Attribute</td>
      <td class="header">Type</td>
      <td class="header">Description</td>
    </tr>
    <tr>
      <td><code>deltaX</code></td>
      <td><code>float</code></td>
      <td>Horizontal scroll amount. <strong>Read only.</strong></td>
    </tr>
    <tr>
      <td><code><code>de<code>ltaY</code></code></code></td>
      <td><code>float</code></td>
      <td>Vertical scroll amount. <strong>Read only.</strong></td>
    </tr>
    <tr>
      <td><code>deltaZ</code></td>
      <td><code>float</code></td>
      <td>Scroll amount for the z-axis. <strong>Read only.</strong></td>
    </tr>
    <tr>
      <td><code>deltaMode</code></td>
      <td><code>unsigned long</code></td>
      <td>Unit of delta values. See {{ anch("Delta modes") }} for a list of permitted values. <strong>Read only.</strong></td>
    </tr>
  </tbody>
</table>
<h2 id="Constants">Constants</h2>
<h3 id="Delta_modes">Delta modes</h3>
<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>The delta values are specified in pixels.</td>
    </tr>
    <tr>
      <td><code><code>D<code>OM_DELTA_LINE</code></code></code></td>
      <td><code>0x01</code></td>
      <td>The delta values are specified in lines.</td>
    </tr>
    <tr>
      <td><code>DOM_DELTA_PAGE</code></td>
      <td><code>0x02</code></td>
      <td>The delta values are specified in pages.</td>
    </tr>
  </tbody>
</table>
<h2>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 (WebKit)</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatGeckoDesktop("17.0") }}</td>
        <td>{{ CompatIE("9.0") }}</td>
        <td>{{ CompatNo() }}</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>Firefox Mobile (Gecko)</th>
        <th>IE&nbsp;Phone</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatGeckoMobile("17.0") }}</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatUnknown() }}</td>
      </tr>
    </tbody>
  </table>
</div>
<h2 class="note" id="See_also">See also</h2>
<ul>
  <li>{{ domeventxref("wheel") }}</li>
  <li>Non-gecko browsers' legacy mosue wheel event object: {{ domxref("MouseWheelEvent") }}</li>
</ul>
Revert to this revision