我们有一个使用 JQuery Mobile、PhoneGap 和 ASP.net MVC 构建的移动网络应用程序。 该应用程序的目标是在 iOS 和 Android 设备上运行,无论使用何种浏览器。 我们已经在下面列出的设备上测试了该应用程序,它似乎可以正常工作,没有任何问题
iOS 5 - iPad、iPhone。
Android 4.1.2 - Google Nexus 7、三星 Galaxy S3、三星 Galaxy Note 2、三星 Galaxy Tab 2。
Android 4.0.3 - Asus Transformer 选项卡
但是在 Samsung Galaxy Note 800 的 Android Stock 浏览器 4.1.2 上测试时,我们遇到了一个非常奇怪的问题。启用滚动时,放置在具有 css 属性“overflow:auto”的 div(例如子 div)中的元素不会响应任何触摸事件。这里要注意的主要是包含此 div 的 Parent div 绝对定位为 'position:abolute'。在网上研究了一段时间后,我们发现绝对位置和溢出属性的组合可能会导致Android浏览器出现一些问题。
目前无法移除绝对位置,因为这会导致完全重新设计布局,并且我们只剩下几天的发布时间了。那么任何人都可以建议快速解决这个问题吗?
最佳答案
改用 overflow-x
和/或 overflow-y
属性。
EG
overflow-y: scroll; /* allow vertical scrolling */
-webkit-overflow-scrolling: touch; /* optional momentum scrolling */
此外,由于滚动条在触控设备上是隐藏的,因此您可以使用 :scroll
而不是 :auto
。它看起来一样,但可能不会出现相同的错误。
关于android - Android 浏览器上的 CSS 溢出和绝对定位问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17938755/