gpt4 book ai didi

android - Chrome 手机忽略溢出

转载 作者:行者123 更新时间:2023-11-28 18:31:41 26 4
gpt4 key购买 nike

我正在尝试为 Android 创建一个 Web 应用程序。我一直在将 phonegap 与 JQM 结合使用,但遇到了问题。

我正在实现一个滑入式菜单,为此我在互联网上找到了一个简单的例子。

http://www.aldomatic.com/jqm/fb-menu-style/

这个简单的菜单从左侧滑入,这部分效果很好,但是当我尝试将其滑入时出现问题。整个页面滚动,尽管我有

#mobileViewport {
overflow: hidden;
}

(body标签的id为mobileViewport

我也试过将它添加到 html 标签中,但无济于事。

这是一个错误吗?有什么解决方法吗?

最佳答案

默认情况下,JQM 页面绝对定位在其包含元素的流之外(如果包含元素是静态定位的)。

因此,在包含元素(正文)上添加 overflow:hidden 没有任何帮助。

如果您将 position:relative 应用于 #mobileViewport,这应该会导致 JQM 移动页面现在从包含元素和 overflow:hidden 应该可以工作。

但是,我怀疑这可能不是一个好主意,并且必然会导致其他 CSS 显示问题。 (我记得有一次我自己也玩过这个,结果有其他问题作为副作用)

可能更好的主意是将 overflow:hidden 添加到 JQM 页面元素本身。

<body class="ui-mobile-viewport">
<div id="mypage" data-role="page" class="ui-page">
...
</div>
</div>

#mypage {
overflow:hidden;
}

注意:如果您有页脚,您可能希望将 overflow:hidden 应用于子 .ui-content 元素。

关于android - Chrome 手机忽略溢出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14094433/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com