移动 Safari 视口(viewport) - 防止水平滚动?

标签 mobile mobile-safari viewport

我正在尝试为移动 Safari 配置视口(viewport)。使用视口(viewport)元标记,我试图确保没有缩放,并且您不能水平 ScrollView 。这是我正在使用的元标记:

<meta id="viewport" name="viewport" content ="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />

在我的 iPhone 上,当我加载页面时,它看起来还不错:

screenshot

但我可以水平滚动,使其看起来像这样(这是我能走到的最右边:

screenshot

当我将它摆动到横向 View 时,页面按预期呈现,锁定水平滚动位置。

我试图弄清楚如何让这个页面根本不水平滚动。是否有可能我有一些页面元素将内容推出?我什至不希望通过正确的视口(viewport)设置来实现这一点,但我在这里捕获了稻草。

最佳答案

Is it possible that I've got some page element pushing the content out?



是的,确实如此。视口(viewport)设置仅定义可见视口(viewport)区域,但不处理关闭横向平移。

因此,为了避免这种情况发生,请在包含您的内容的元素上设置一个溢出:隐藏,否则,避免元素溢出。

注意:其他移动浏览器也支持 viewport 元标记,因此您也需要在这些中进行测试。

关于移动 Safari 视口(viewport) - 防止水平滚动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5543495/

相关文章:

javascript - 使用 JavaScript 计算 li 元素和视口(viewport)之间的距离

java - 如何找到某些手机的内存大小?

android - 在后台作为服务运行移动 Web 应用程序

javascript - owl slider 2 显示裁剪的下一张幻灯片

javascript - iOS 6 上的 Safari 是否缓存 $.ajax 结果?

html - 当 body 设置为 1020px 时视口(viewport)不工作

c++ - OpenGL 子窗口不会同时响应

javascript - bootstrap-通过代码关闭“移动(汉堡)”菜单

iphone - 如何从移动 safari 上的文本输入中删除边框样式?

ios - Cloud Foundry node.js 应用程序在 iOS Safari 移动设备上加载缓慢