De toute façon à empêcher le défilement horizontal déclenchement de balayage geste sur OS X Lion Safari?

Question

Je suis en train de travailler sur une INTERFACE utilisateur qui utilise le défilement horizontal en div élément (à l'aide d' overflow: scroll). Je ne peux pas faire défiler à gauche, parce qu'il allait commencer l'animation pour un retour dans l'histoire. De même, je ne peux pas faire défiler vers la droite quand il y a un site web pour aller de l'avant pour.

Il fonctionne bien sur d'autres navigateurs, y compris google Chrome sur mac OS X Lion, qui prend également en charge le balayage de revenir en arrière dans l'histoire. (À un moment, alors que j'étais en développement, le défilement dans un div a travaillé sur Safari, trop. J'ai ajouté des gestionnaires d'événements et html, probablement cassé le défilement, mais je n'ai aucune idée de ce qu'il a fait le changement.)

Idéalement, j'aimerais éviter d'aller en arrière ou en avant dans l'histoire lors du défilement sur un div (même lorsqu'il a atteint la fin.)

Mise à jour: j'ai essayé d'ajouter jQuery.la roulette de la souris et c'est en quelque sorte résolu le problème. (J'ai juste branché un gestionnaire d'événements vide sur .mousewheel().) Je suis toujours à la recherche d'une réponse définitive.

Answer 1

J'ai été à la recherche d'une solution pour jours. Ce que j'ai à ce jour est dans ce plugin:

https://github.com/micho/jQuery.preventMacBackScroll

Il handicapées de défilement pour OSX Chrome (je ne pouvais pas trouver un moyen de le désactiver pour OSX Safari) lorsque vous faites défiler vers la gauche et vers le haut.

J'espère que ça aide, n'hésitez pas à contribuer au projet avec tous les bugs que vous trouvez, ou si vous trouvez un moyen pour désactiver ce comportement gênant pour Safari

Answer 2

Oui, afin de désactiver le comportement par défaut (balayer, pincer, etc.) tout ce que vous avez à faire est d'ajouter:

event.preventDefault();

Dans votre cas il suffit de s'inscrire touchMove auditeur et l'utilisation preventDefault() il y a (dans la fonction "touchmove").

element.addEventListener("touchmove", touchMove, false);

Answer 3

J'ai aussi utilisé jQuery molette de la souris, de l'attachement de ce rappel:

onMousewheel: function(e, delta, deltaX, deltaY){
  e.preventDefault();
  $('leftElement').scrollLeft($('leftElement').scrollLeft() + deltaX); // leftElement =     container element I want to scroll left without going back/forward
  $('downElement').scrollTop($('downElement').scrollTop() - deltaY); // this was another element within the container element
}