IOS css -webkit-transform: l'échelle ne coupe pas les événements tactiles

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.

Marquage

 <iframe src="http://wikipedia.org" width="200" height="200"/> 

CSS

 iframe { -webkit-transform-style: preserve-3d; -webkit-transform: scale3d(0.4,0.4,0.4); } 

Fiddle: http://jsfiddle.net/gyHR6/


En savoir plus sur -webkit-transform-style ici: https://www.webkit.org/blog-files/3d-transforms/transform-style.html