[英]Mobile web: -webkit-overflow-scrolling: touch conflicts with position:fixed
I use position: fixed
to create a fixed top navigation menu on my mobile web application. 我使用
position: fixed
在我的移动Web应用程序上创建一个固定的顶部导航菜单。
After adding -webkit-overflow-scrolling: touch
, the scrolling works smoothly. 添加
-webkit-overflow-scrolling: touch
,滚动工作将顺利进行。 However, the top menu disappears during scrolling. 但是,顶部菜单在滚动过程中消失。 It shows only after the scrolling stops.
仅在滚动停止后显示。
I have searched many solutions, such as CSS3 property webkit-overflow-scrolling:touch ERROR and iOS5 Images disappear when scrolling with webkit-overflow-scrolling: touch . 我搜索了许多解决方案,例如CSS3属性webkit-overflow-scrolling:touch错误和iOS5使用webkit-overflow-scrolling滚动时图像消失:touch 。 However, the given solutions are not working for me.
但是,给定的解决方案不适用于我。 Please check out this example: http://jsbin.com/woxuwihuzu/12/ (visited from iPhone 5c Chrome/Firefox).
请查看以下示例: http : //jsbin.com/woxuwihuzu/12/ (从iPhone 5c Chrome / Firefox访问)。
Did I miss anything? 我有想念吗?
After two days struggling, I found this post saves me: 100% screen height css . 经过两天的苦苦挣扎,我发现这篇文章为我省了: 100%屏幕高度css 。
I have to limit the height of my content area to be the same height of the screen. 我必须将内容区域的高度限制为与屏幕相同的高度。 Please find the working demo here: http://jsbin.com/tubaqaqumi/3/ (visit from a real phone; a Chrome simulator doesn't tell the difference).
请在此处找到有效的演示: http : //jsbin.com/tubaqaqumi/3/ (通过真实电话访问; Chrome模拟器无法说明区别)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.