Android 浏览器宽度拉伸(stretch)到 iframe 内容宽度，尽管溢出 :hidden

Question

我试图在 Android(Dolphin 浏览器)中模仿桌面风格的 iframe，并取得了一些成功。使用的技巧是放置一个 <iframe>与 position:relative;在 <div> 里面具有固定尺寸和 overflow:hidden; ，然后使用 jQuery Mobile(或者更确切地说只是 vmouse 事件)来处理用于滚动的鼠标事件。

除一件事外，所有这些都工作正常；尽管 <iframe>被裁剪后，它的内容会拉伸(stretch)浏览器以匹配大小。这在高度方面最为明显。

这是 JSFiddle 中的简化示例代码:http://jsfiddle.net/euKhG/

这是在 Android 浏览器中观看的结果:http://jsfiddle.net/euKhG/embedded/result/ (仅适用于 Android 浏览器!)。

有人知道如何解决这个问题吗？我在其他地方看到了 iScroll 和类似的建议，但它们似乎与 Remote 接触框架 src像这样。

Answer 1

尝试在 meta 标签中设置 target-densitydpi

    <meta id="viewport" name="viewport" content="initial-scale=1, user-scalable=no, width=device-width, target-densitydpi=160dpi"/>

但是你也必须为此更改所有其他 css