Question

我有一个iframe，我需要在iOS设备上显示。 iframe的内容不受我的控制，他们没有任何响应（固定800x600）。所以我想缩小iframe以在iOS视口中显示它。

使用-webkit-transform: scale(0.4)我能够缩小它，但现在触摸事件都是错误的（例如触摸表单元素不会弹出键盘）。如果你在缩放之前触摸元素的位置就可以了。

有没有办法纠正触摸事件的偏移？

Answer 1

选择scale3d代替scale。根据我的经验，当元素被推入加速堆栈时，可以更好地实现转换需要响应的元素。

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

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