Safari iPad 1: comment désactiver le zoom / centrage sur un double-tap, mais garder le pincement zoom

Il n'y a pas d'autre moyen que de rattraper les événements que vous souhaitez éviter, et d'appeler preventDefault() sur eux, comme vous l'avait déjà plus ou moins compris.

En effet, certaines propriétés CSS /valeurs peuvent changer le site global de comportement (largeur fixe ou fixedpar exemple), mais vous n'êtes pas à l'abri des changements de l'OS (voir fixedla gestion du changement dans iOS5), ni de faire ces changements nécessairement empêcher tout comportement (pincement peut être désactivé, mais pas de double-tapping).

Donc, la meilleure façon de désactiver le comportement par défaut uniquement pour double-cliquer sur est de profiter de la le comte de la touche iOS fournit: si nous avons un seul contact, alors nous sommes en appuyant sur. De deux, cela signifie que nous pincer.

Suivants de code de configuration fournit cette fonctionnalité:

var elm = document.body; //or some selection of the element you want to disable

var catcher = function(evt) {
    if (evt.touches.length < 2)
        evt.preventDefault();
};

elm.addEventListener('touchstart', catcher, true);

Démo sur jsFiddle.

Remarque: le troisième paramètre (true) à addEventListener signifie que nous voulons la capture des événementsc'est de les attraper tous, même pour nos descendant enfants.

J'ai écrit un plugin jQuery dans le même but, de manière sélective la désactivation appuyez deux fois sur zoom sur des éléments de la page (dans mon cas, les boutons de navigation pour tourner les pages) je tiens à répondre à chaque robinet (y compris double-tap) comme un événement de clic, sans iOS "touche magique", peu importe à quelle vitesse l'utilisateur clique dessus.

À utiliser, il suffit de lancer quelque chose comme $('.prev,.next').nodoubletapzoom(); sur les éléments dont vous vous occupez. Le principe dont il se sert pour écouter consécutives touchstart événements sur un nœud au sein d'500ms, et en cours d'exécution event.preventDefault() sur la deuxième, à moins que d'autres touches sont actives en même temps. En tant que preventDefault consomme le touche, nous avons également synthétiser les deux "raté", cliquez sur événements pour le nœud, de sorte que votre action de contact qui se passe autant de fois que l'utilisateur prévu.

Ce que la version iOS/navigateur Safari utilisez-vous? Le site le plus certainement ne vous permet pas de double-tap. J'ai trouvé un peu de CSS mais je n'ai pas eu le temps de l'essayer car je suis sur le point de sortir:

body {
  -webkit-text-size-adjust:none;
  margin:0px;
}

div{
  clear:both!important;
  display:block!important;
  width:100%!important;
  float:none!important;
  margin:0!important;
  padding:0!important;
}

JQuery approche de désactiver le Double Appuyez sur Zoom dans MVC4
Pour Désactiver le double tap (double de la souris vers le bas) fonctionnalités sur iOS 1+ vous avez besoin pour attraper les évènements touchstart de l'Événement et de créer un remplacement pour empêcher le zoom.

//En utilisant un Seul script.js et JQuery.Mobile-1.2.0 de l'INTERFACE utilisateur de chaque page dans MVC est affectée JQuery par l'intermédiaire de délégués de sorte que vous n'avez pas à faire une actualisation complète de la page vous permettant de tirer parti des données-prefetch qui charge la page dans les DOM lorsque l'application se charge pour la première fois

$(document).délégué("#CashRegister", "pageinit", function () {

//To Disable 'Pinch to Zoom' Note: don't implement gester event handlers if you want to 
//keep pinch to zoom functionality NOTE: i use this as my pageinit is a delegate of a page
this.addEventListener("gesturestart", gestureStart, false);
this.addEventListener("gesturechange", gestureChange, false);
this.addEventListener("gestureend", gestureEnd, false);
//handle each event by disabling the defaults
function gestureStart(event) {
    event.preventDefault();
}

function gestureChange(event) {
    event.preventDefault();
}

function gestureEnd(event) {
    event.preventDefault();
}
//Recreate Double Tap and preventDefault on it
$(this).bind('touchstart', function preventZoom(e) {
//recreate the double tab functionality
        var t2 = e.timeStamp
      , t1 = $(this).data('lastTouch') || t2
      , dt = t2 - t1
      , fingers = e.originalEvent.touches.length; 
        $(this).data('lastTouch', t2);
        if (!dt || dt > 500 || fingers > 1) return; //not double-tap 
        e.preventDefault(); //double tap - prevent the zoom
        //also synthesize click events we just swallowed up
        $(this).trigger('click').trigger('click');
    });