防止移动 Safari 中网站横向滚动
我有一个基于 jQuery Mobile 的网站。 我正在使用视口标签来使我的网站适合屏幕尺寸。
到目前为止,一切都很好。
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
但现在的问题是,我仍然可以在屏幕上滚动我的整个网站(整个移动 safari 浏览器)。
我尝试
body {
overflow:hidden;
}
按照此处其他帖子中的描述进行设置。但这对我不起作用。有人知道如何解决这个问题吗?
I have a website based on jQuery Mobile.
I'm using the viewport tag to fit my site to screen size.
So far so good.
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
But the Problem is now, that I'm still able to scroll my whole site (the whole mobile safari browser) around the screen.
I tried to set
body {
overflow:hidden;
}
like described in other posts here. But it does not work for me. Anyone an idea how to fix that?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
我遇到了同样的问题,最终使用了以下解决方法:
I had the same problem, and ended up using this workaround:
缩放和滚动并不总是相关的。这里的问题不在于视口,而在于网站的实际宽度,如果尺寸比屏幕尺寸宽,则会出现滚动问题。您必须给我们一个实例,以便我们可以帮助您找到溢出布局的元素
Well zooming and scrolling doesn't always have to be related. Your problem here is not with the viewport but with the actual width of your site, if the size is wider than the screen size you will have scrolling issues. You would have to give us a live example so we can help you to find the elements that are overflowing your layout
我将你们的网站与我们自己的网站进行了比较。您使用的是 jQuery Mobile 1.0RC1,我们使用的是 1.0b3。您的网站会出现此问题,但我们的网站不会出现此问题。
也许尝试升级到最新的 jQuery Mobile?
I compared your site with one of our own. You're using jQuery Mobile 1.0RC1 and we're using 1.0b3. The problem occurs with your site but not with ours.
Maybe try upgrading to the latest jQuery Mobile?
正如 Jasper 指出的那样,在尝试获取这些内容时遇到 404:
)看起来您的文件夹名称“jquerymobile-FDL 2”中有一个空格,我会重命名它而不包含空格。
另外,我不确定您是否可以在标题或样式标签内添加元标记,也许将所有元标记移动到头标记的开头?
你似乎也导入两个不同版本的 jQuery
As Jasper pointed out, you have a 404 while trying to fetch these:
You look like you have a space in a folder name "jquerymobile-FDL 2", I would rename this without the space.
Also I'm not sure if you can have a meta tag inside the title or style tags, maybe move all meta tags to the start pf your head tag?
Also you seem to be importing two different versions of jQuery