J'ai un iframe dont j'ai besoin pour l'affichage sur les périphériques iOS. Le contenu de l'iframe n'est pas sous mon contrôle et ils ne répondent en aucune façon (fixe 800×600). Donc, j'aimerais mettre à l'échelle l'iframe vers le bas pour l'afficher dans la fenêtre d'affichage iOS.
Utilisation de -webkit-transform: scale(0.4)
J'ai pu l'abaisser, mais maintenant les événements tactiles sont tous faux (p. Ex., Toucher un élément de forme, pas ouvrir le clavier). Si vous touchez où l'élément était avant la mise à l'échelle, cela fonctionne.
Existe-t-il un moyen de corriger le décalage pour les événements tactiles?
Optez pour scale3d
au lieu d' scale
. Dans mon expérience, les éléments de transformation qui doivent être sensibles ont été mieux réalisés lorsque l'élément a été poussé dans la pile accélérée.
<iframe src="http://wikipedia.org" width="200" height="200"/>
iframe { -webkit-transform-style: preserve-3d; -webkit-transform: scale3d(0.4,0.4,0.4); }
En savoir plus sur -webkit-transform-style
ici: https://www.webkit.org/blog-files/3d-transforms/transform-style.html