Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in English Always switch to English

Element : évènement mousewheel

Obsolète: Cette fonctionnalité n'est plus recommandée. Même si certains navigateurs la prennent encore en charge, elle a peut-être déjà été supprimée des standards du web, est en passe d'être supprimée ou n'est conservée qu'à des fins de compatibilité. Évitez de l'utiliser et mettez à jour le code existant si possible ; consultez le tableau de compatibilité au bas de cette page pour vous aider à prendre votre décision. Sachez que cette fonctionnalité peut cesser de fonctionner à tout moment.

Non standard: Cette fonctionnalité n'est pas standardisée. Nous déconseillons d'utiliser des fonctionnalités non standard en production, car leur prise en charge par les navigateurs est limitée, et elles peuvent être modifiées ou supprimées. Toutefois, elles peuvent constituer une alternative appropriée dans certains cas où aucune option standard n'existe.

L'évènement obsolète et non standard mousewheel est déclenché de manière asynchrone sur un objet Element pour fournir des mises à jour lorsqu'une molette de souris ou un dispositif similaire est utilisé. L'évènement mousewheel n'a jamais fait partie d'une norme, et bien qu'il ait été implémenté par plusieurs navigateurs, il n'a jamais été implémenté par Firefox.

Note : Au lieu de cet évènement obsolète, utilisez l'évènement standard wheel.

Syntaxe

Utilisez le nom de l'évènement dans des méthodes comme addEventListener(), ou définissez une propriété gestionnaire d'évènement.

js
addEventListener("mousewheel", (event) => { })

onmousewheel = (event) => { }

Type d'évènement

Un objet WheelEvent. Hérite de MouseEvent, UIEvent et Event.

Event UIEvent MouseEvent WheelEvent

La propriété detail

La valeur de la propriété detail est toujours nulle, sauf dans Opera, qui utilise detail de manière similaire à l'évènement spécifique à Firefox DOMMouseScroll dont la valeur detail indique la distance de défilement en termes de lignes, les valeurs négatives indiquant que le défilement se fait vers le bas ou vers la droite, et les valeurs positives indiquant un défilement vers le haut ou vers la gauche.

Note : Sur macOS, la distance de défilement (et donc la valeur de detail) est calculée en fonction de la distance de défilement accélérée.

Sur Linux, 2 ou -2 est défini par évènement de molette natif.

Valeur de wheelDelta, wheelDeltaX et wheelDeltaY

La valeur de l'attribut wheelDelta est une valeur abstraite qui indique de combien la molette a tourné. Si la molette a tourné loin de l'utilisateur·ice, elle est positive, sinon négative. Cela signifie que le signe de la valeur delta est différent de celui de wheel de DOM Level 3 Event. Cependant, la signification de la quantité de ces valeurs n'est pas la même selon les navigateurs. Voir l'explication suivante pour plus de détails.

Internet Explorer et Opera (Presto) ne prennent en charge que l'attribut wheelDelta et ne prennent pas en charge le défilement horizontal.

La valeur de l'attribut wheelDeltaX indique la valeur de l'attribut wheelDelta le long de l'axe horizontal. Lorsque l'utilisateur·ice utilise le dispositif pour faire défiler vers la droite, la valeur est négative. Sinon, c'est-à-dire si c'est vers la gauche, la valeur est positive.

La valeur de l'attribut wheelDeltaY indique la valeur de l'attribut wheelDelta le long de l'axe vertical. Le signe de la valeur est le même que celui de l'attribut wheelDelta.

Chrome

Sur Windows, la valeur est la même que la valeur delta de WM_MOUSEWHEEL ou WM_MOUSEHWHEEL. De plus, la valeur ne change pas même si la quantité de défilement des paramètres système est le défilement par page, c'est-à-dire que la valeur est la même que celle d'IE sur Windows.

Sur Linux, la valeur est 120 ou -120 par évènement de molette natif. Cela produit le même comportement que IE et Chrome sur Windows.

Sur macOS, la valeur est compliquée. La valeur change si le dispositif qui provoque l'évènement de molette natif prend en charge le défilement continu.

Si le dispositif prend en charge le défilement continu (par exemple, le trackpad d'un MacBook ou une molette de souris qui peut être tournée en douceur), la valeur est calculée à partir de la quantité de défilement accélérée. Dans ce cas, la valeur est la même que celle de Safari.

Si le dispositif ne prend pas en charge le défilement continu (typiquement, une ancienne molette de souris qui ne peut pas être tournée en douceur), la valeur est calculée à partir de la quantité de défilement non accélérée (120 par cran). Dans ce cas, la valeur est différente de celle de Safari.

Cette différence pose un problème sérieux pour les développeur·euse·s d'applications web. En effet, les développeur·euse·s web ne peuvent pas savoir quel dispositif a provoqué l'évènement mousewheel.

Safari

La valeur est toujours calculée à partir de l'accélération du défilement. Cela diffère considérablement des autres navigateurs, à l'exception de Chrome sur les appareils prenant en charge le défilement continu.

Opera (Presto)

La valeur est toujours la valeur de l'attribut detail40.

Sur Windows, comme la valeur de l'attribut detail est calculée à partir de la quantité de défilement réelle, la valeur est différente des autres navigateurs, sauf si la quantité de défilement par cran est de 3 lignes dans les paramètres système ou une page.

Sur Linux, la valeur est 80 ou -80 par évènement de molette natif. Cela diffère des autres navigateurs.

Sur macOS, la valeur de l'attribut detail est calculée à partir de la quantité de défilement accélérée de l'évènement de molette natif. La valeur est généralement beaucoup plus grande que celle de Safari ou de Chrome.

Spécifications

Ne fait partie d'aucune spécification.

Compatibilité des navigateurs

Voir aussi

  • L'évènement standard wheel à écouter à la place.