diff options
Diffstat (limited to 'files/es/web/api/element/wheel_event/index.html')
| -rw-r--r-- | files/es/web/api/element/wheel_event/index.html | 122 |
1 files changed, 1 insertions, 121 deletions
diff --git a/files/es/web/api/element/wheel_event/index.html b/files/es/web/api/element/wheel_event/index.html index 90682cccd3..1e2d01631d 100644 --- a/files/es/web/api/element/wheel_event/index.html +++ b/files/es/web/api/element/wheel_event/index.html @@ -83,127 +83,7 @@ translation_of: Web/API/Element/wheel_event <h2 id="Compatibilidad">Compatibilidad</h2> -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Característica</th> - <th>Chrome</th> - <th>Edge</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Soporte básico</td> - <td>31</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatGeckoDesktop("17.0")}}</td> - <td>{{CompatIE("9.0")}}<sup>[1]</sup></td> - <td>18</td> - <td>7.0</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Característica</th> - <th>Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Soporte básico</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoMobile("17.0")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<p>[1] Internet Explorer solo toma el evento "wheel" mediante <code>addEventListener</code>, no se permite el atributo <code>onwheel</code> en objetos del DOM. <a href="https://connect.microsoft.com/IE/feedback/details/782835/missing-onwheel-attribute-for-the-wheel-event-although-its-supported-via-addeventlistener">Bug report.</a><br> - </p> - -<h3 id="Escuchar_al_evento_en_distintos_navegadores">Escuchar al evento en distintos navegadores</h3> - -<p>En el siguiente script se crea el método multi-navegador <code>addWheelListener </code>que permite escuchar el evento wheel en diferentes navegadores a la vez que se previene el funcionamiento por defecto.</p> - -<pre class="brush:js;">// crea el metodo "addWheelListener" global -// ejemplo: addWheelListener( elem, function( e ) { console.log( e.deltaY ); e.preventDefault(); } ); -(function(window,document) { - - var prefix = "", _addEventListener, support; - - // detecta el tipo de evento permitido por el navegador - if ( window.addEventListener ) { - _addEventListener = "addEventListener"; - } else { - _addEventListener = "attachEvent"; - prefix = "on"; - } - - // detecta el tipo de evento wheel manejado por el navegador - support = "onwheel" in document.createElement("div") ? "wheel" : // Los navegadores modernos permiten "wheel" - document.onmousewheel !== undefined ? "mousewheel" : // Webkit e IE soportan al menos "mousewheel" - "DOMMouseScroll"; // Asumiremos que el resto de navegadores son Firefox antiguos - - window.addWheelListener = function( elem, callback, useCapture ) { - _addWheelListener( elem, support, callback, useCapture ); - - // controlaremos MozMousePixelScroll en Firefox antiguos - if( support == "DOMMouseScroll" ) { - _addWheelListener( elem, "MozMousePixelScroll", callback, useCapture ); - } - }; - - function _addWheelListener( elem, eventName, callback, useCapture ) { - elem[ _addEventListener ]( prefix + eventName, support == "wheel" ? callback : function( originalEvent ) { - !originalEvent && ( originalEvent = window.event ); - - // Creamos un objeto de evento - var event = { - // tomamos como referencia el objeto original - originalEvent: originalEvent, - target: originalEvent.target || originalEvent.srcElement, - type: "wheel", - deltaMode: originalEvent.type == "MozMousePixelScroll" ? 0 : 1, - deltaX: 0, - deltaZ: 0, - preventDefault: function() { - originalEvent.preventDefault ? - originalEvent.preventDefault() : - originalEvent.returnValue = false; - } - }; - - // calculamos deltaY (y deltaX) dependiendo del evento - if ( support == "mousewheel" ) { - event.deltaY = - 1/40 * originalEvent.wheelDelta; - // Webkit tambien soporta wheelDeltaX - originalEvent.wheelDeltaX && ( event.deltaX = - 1/40 * originalEvent.wheelDeltaX ); - } else { - event.deltaY = originalEvent.detail; - } - - // Disparamos el callback - return callback( event ); - - }, useCapture || false ); - } - -})(window,document);</pre> +{{Compat("api.Element.wheel_event")}} <h2 id="Notas_para_Gecko">Notas para Gecko</h2> |
