如何在 iOS Safari 上启用 iframe 滚动条
Posted
技术标签:
【中文标题】如何在 iOS Safari 上启用 iframe 滚动条【英文标题】:How to enable iframe scrollbar on iOS safari 【发布时间】:2011-01-20 20:29:43 【问题描述】:我正在尝试在我的网站上实现 facebook 的直播插件。我看到 pc 和 mac 浏览器上有一个滚动条,但在 iphone 或 ipad safari 上没有。我认为这是因为 iphone 和 ipad 对待滚动条的方式不同,因为它们都是基于触摸的设备。所以我希望用两根手指滚动 iframe,但它也不起作用。
这里是示例页面(使用不同的 src url)http://para.qacode.com/test.php
如何在 ios safari 上启用两指滚动或普通滚动条?
【问题讨论】:
【参考方案1】:在 iOS 5 之前的版本中,您可以使用两根手指在 iPad/iPhone 上滚动 iframe,但这有点隐藏功能,大多数人都不知道。我不确定为什么拖指滚动不适用于您的 iframe - 也许有一些 javascript 拦截了触摸事件?
在 iOS 5 上,此问题已得到修复,并且对于使用一根手指的 iframe 可以正常滚动。
如果您需要在 iOS 4 和更早版本上滚动页面的子区域,最好的办法是使用 iScroll 之类的库,该库通过 JavaScript 触摸事件处理实现滚动。
【讨论】:
【参考方案2】:将这些样式应用到父容器:
-webkit-overflow-scrolling:touch;
overflow:auto;
【讨论】:
以上是关于如何在 iOS Safari 上启用 iframe 滚动条的主要内容,如果未能解决你的问题,请参考以下文章
如何在我的网站上启用iOS 5 Safari Reader?
如何在私有模式下在 iOS Safari 浏览器上启用 LocalStorage?
IFRAMEs 和 iPad 上的 Safari,用户如何滚动内容?