Empêcher le zoom sur du tactile

Bonjour à tous,

j'ai fais un petit jeu en jQuery qui consiste à cliquer sur des images, cependant la fonction sur tout les appareils tactiles c'est le Zoom au double clique...

Dans mon jeu les images sont assez proches donc la personne peut faire un double clique malgré elle et bien sûr ça zoom, c'est quelque peut désagréable...

Et je voudrais savoir comment faire pour bloquer cette fonctionnalité ?


Merci de votre aide

Salut,

Même s'il n'est pas recommandable de neutraliser le zoom, la combinaison suivante est efficace, du moins sous iOS :

<meta name="viewport" content="initial-scale=1.0; maximum-scale=1.0" />

merci de ton aide je vais test aussi sur un téléphone Android.

##edit##
je confirme que android ne prend pas du tout en compte ce viewport
Modifié par bart77 (28 Dec 2011 - 10:02)

a écrit :
je confirme que android ne prend pas du tout en compte ce viewport

Et tant mieux !

Bonjour,

Je ne comprends pas pourquoi tu dit tant mieux.

Je suis entrain de développer une application mobile.

J'ai fais une feuille de style css pour avoir des grosses cases (les utilisateurs auront des gros doigts), seulement voila, mes inputs sont gros, et le zoom + apparition du clavier ne laisse la place qu'a quelque caractére.

Pourtant la taille de l'application se régle en fonction de la résolution et de l'orientation, donc vraiment pas besoin du zoom.

Le téléphone qui sera utilisé est un galaxie ace.

Ce zoom c'est casse pied j'en veux pas, je dirais plutot dommage que tant mieux, car les autres solutions que j'ai trouvé concernant android pour désactiver le zoom, bousille la mise en page automatique à l'orientation.

C'est comme neutraliser un clic droit, c'est empêcher une fonction basique qui marche sur tout les sites et que tout le monde à l'habitude d'utiliser.

Empêcher une habitude d'un utilisateur c'est l'embêter ^^

@Fabious : Dans le cas d'un site mobile, le zoom peut au contraire être gênant (notamment à cause des menus en position fixe, ou de la perte de contrôle sur des éléments en "pixel perfect").
Et puis si le site est conçu pour les mobiles, le texte sera assez gros pour être lisible, donc l'utilisateur n'a plus besoin du zoom.

La syntaxe fournie par Victor est incorrecte.

Voici la bonne :

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

Tiens nous au courant si jamais ça a fonctionné !

Kaelig a écrit :
@Fabious : Dans le cas d'un site mobile, le zoom peut au contraire être gênant (notamment à cause des menus en position fixe, ou de la perte de contrôle sur des éléments en "pixel perfect").

Problème de conception alors, il existe des solutions.

Kaelig a écrit :
Et puis si le site est conçu pour les mobiles, le texte sera assez gros pour être lisible, donc l'utilisateur n'a plus besoin du zoom.

Il existe des personnes qui ont vraiment besoin de zoomer très fort pour lire, leur enlever cette possibilité est un gros problème d'accessibilité.

Faire un menu en position fixe, ce n'est pas un "problème de conception", mais une orientation (qui n'est pas uniquement graphique). Le réflexe du double clic a la dent dure sur mobile, et le double-tap dans un menu, ça ne provoque pas un chargement de page mais un zoom (à moins d'intercepter le tap en JS) !

Pour avoir intégré des sites adaptatifs et des applications web mobiles, je trouve ça plutôt pas mal d'avoir le contrôle sur le zoom, le scroll horizontal etc. C'est surtout pratique pour éviter les bugs de replacement du design lors d'une rotation (des solutions en JS permettant le zoom + un replacement correct du design commencent à fonctionner, mais pas partout…).


Autre alternative intéressante : Il y a aussi la fonction zoom sous iOS (dans les préférences accessibilité) qui respecte le design et permet à l'utilisateur de beaucoup zoomer.

Bref, selon les cas (je ne dis pas qu'il faille le faire tout le temps), désactiver le zoom permet de s'éviter pas mal de maux de tête.