Comment simuler un zoom par pincement dans Google Chrome?
Je développe une fonctionnalité de zoom par pincement pour une application mobile écrite en javascript et je souhaite la tester dans Google Chrome avec la fonctionnalité d'émulation de périphérique mobile. Mais je ne peux pas trouver un moyen de tester un geste de pincement.
J'ai essayé tout ce que je pouvais trouver sur Internet (appuyer sur Maj et déplacer la souris, appuyer sur Alt et déplacer la souris), mais rien de tout cela n'a fonctionné. Existe-t-il même un moyen "natif" dans Google Chrome de simuler un geste de zoom avec pincement?
j'utilise la version MacOs de la version de Google Chrome 59.0.3071.86
Sous Chrome 66, en mode de simulation, double-cliquez et faites glisser les zooms avant/arrière.
Shift+ plus de détails sur toutes les épreuves
Работает для меня. Динственная проблема заключается в том, что событие touchstart вернет 1 для originalEvent.touches
Les gestes de pincement ont des écouteurs différents dans différents navigateurs, mais il existe une bibliothèque légère exceptionnelle nommée hammer.js qui gère les pincements, les glissements et ... très simple dans tous les navigateurs. Malheureusement, elle ne prend pas en charge Desktop Chrome. , afin que vous ne puissiez pas déboguer vos codes web-mobile facilement,
Shift-Mouse cliquer et glisser sur Desktop Chrome avec la bibliothèque de marteaux ne fonctionne pas non plus correctement, il active l'événement Pan du marteau au lieu de pincer et ne fonctionne qu'une seule fois !, après cela, il continue d'appeler l'événement Pan lorsque vous déplacez votre souris dans votre fenêtre d'affichage rend le débogage impossible.
Solution: Le seul moyen pratique, à ma connaissance, de tester vos gestes sur un navigateur mobile consiste à utiliser la connexion Safari to Safari sur les appareils ios/osx ou Chrome à Chrome pour les appareils Android.
J'utilise pour déboguer mes codes JavaScript avec Chrome DevTools, mais dans les projets Web-mobiles, j'utilise Safari Web Inspector, car j'ai un iPhone et un Mac !. vous ne pouvez pas non plus déboguer votre appareil ios avec Desktop Chrome.
Jetez un coup d’œil à cet article pour savoir comment configurer votre Safari Web Inspector.
Remarque: vous devez connecter votre iPhone à votre Mac à l'aide d'un câble USB et activer Web Inspector sur votre iPhone (Paramètres-> Safari -> Avancé -> Web Inspector). Si vous ne parvenez pas à voir Develop menu sur votre Safari, allez dans Préférences et dans l'onglet Avancé, cochez la case "Afficher le menu de développement dans la barre de menus". le reste est expliqué dans l'article mentionné ci-dessus.
Mettre à jour
Il n'est pas possible de déboguer un périphérique ios sur un Windows Desktop Safari.
Sur Chrome v.71.x.x, vous pouvez pincer le zoom en appuyant sur "Basculer la barre d’outils Périphérique" dans les outils de développement, puis maintenez la touche Maj enfoncée tout en maintenant la touche Maj enfoncée, puis faites glisser la souris.
La dernière réponse a cinq votes négatifs, mais ce que je veux dire, c'est que le dernier navigateur chrome (78) sur la plate-forme Android n'a pas la fonction de zoom. Vous pouvez avoir des problèmes avec votre compréhension de viewport. L'échelle de la fenêtre d'affichage est Pinchzoom. Si vous le définissez ainsi, votre page Web ne peut pas déclencher Pinchzoom.
<meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
Votre pouvez définir de cette façon dans votre page Web
<meta name="viewport" content="initial-scale=1, maximum-scale=5, minimum-scale=1, user-scalable=yes">
Les autres réponses ont déjà dit que les raccourcis pour zoom à pincement.