Pour une question différente, j'ai composé cette réponse , y compris cet exemple de code .
Dans ce code, j'utilise la molette de la souris pour effectuer un zoom avant / arrière sur un canevas HTML5. J'ai trouvé du code qui normalise les différences de vitesse entre Chrome et Firefox. Cependant, la gestion du zoom dans Safari est beaucoup, beaucoup plus rapide que dans l'un ou l'autre.
Voici le code que j'ai actuellement:
var handleScroll = function(e){
var delta = e.wheelDelta ? e.wheelDelta/40 : e.detail ? -e.detail/3 : 0;
if (delta) ...
return e.preventDefault() && false;
};
canvas.addEventListener('DOMMouseScroll',handleScroll,false); // For Firefox
canvas.addEventListener('mousewheel',handleScroll,false); // Everyone else
Quel code puis-je utiliser pour obtenir la même valeur «delta» pour la même quantité de molette de la souris sur Chrome v10 / 11, Firefox v4, Safari v5, Opera v11 et IE9?
Cette question est liée, mais n'a pas de bonne réponse.
Edit : Une enquête plus approfondie montre qu'un événement de défilement 'up' est:
| evt.wheelDelta | evt.detail ------------------ + ---------------- + ------------ Safari v5 / Win7 | 120 | 0 Safari v5 / OS X | 120 | 0 Safari v7 / OS X | 12 | 0 Chrome v11 / Win7 | 120 | 0 Chrome v37 / Win7 | 120 | 0 Chrome v11 / OS X | 3 (!) | 0 (peut-être faux) Chrome v37 / OS X | 120 | 0 IE9 / Win7 | 120 | indéfini Opera v11 / OS X | 40 | -1 Opera v24 / OS X | 120 | 0 Opera v11 / Win7 | 120 | -3 Firefox v4 / Win7 | undefined | -3 Firefox v4 / OS X | undefined | -1 Firefox v30 / OS X | undefined | -1
De plus, l'utilisation du trackpad MacBook sous OS X donne des résultats différents même en se déplaçant lentement:
- Sur Safari et Chrome, la
wheelDelta
valeur est de 3 au lieu de 120 pour la molette de la souris. - Sur Firefox,
detail
c'est généralement2
, parfois1
, mais lorsque vous faites défiler très lentement AUCUN ÉVÉNEMENT HANDLER INCENDIE .
La question est donc:
Quelle est la meilleure façon de différencier ce comportement (idéalement sans aucun agent utilisateur ni reniflage du système d'exploitation)?
e.wheelDelta/120
?