javascript - 移动网站 : -webkit-overflow-scrolling: touch conflicts with position:fixed

标签 javascript css scroll css-position

我使用 position: fixed 在我的移动网络应用程序上创建一个固定的顶部导航菜单。

添加-webkit-overflow-scrolling: touch后,滚动流畅。但是,顶部菜单在滚动过程中消失。它仅在滚动停止后显示。

我搜索了很多解决方案,比如CSS3 property webkit-overflow-scrolling:touch ERRORiOS5 Images disappear when scrolling with webkit-overflow-scrolling: touch .但是,给定的解决方案对我不起作用。请查看此示例:http://jsbin.com/woxuwihuzu/12/ (从 iPhone 5c Chrome/Firefox 访问)。

我错过了什么吗?

最佳答案

经过两天的挣扎,我发现这个帖子救了我:100% screen height css .

我必须将我的内容区域的高度限制为与屏幕的高度相同。请在此处找到工作演示:http://jsbin.com/tubaqaqumi/3/ (通过真实手机访问;Chrome 模拟器无法区分)。

关于javascript - 移动网站 : -webkit-overflow-scrolling: touch conflicts with position:fixed,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29695082/

相关文章:

javascript 与 jQuery 自定义/全局变量范围

javascript - 嵌套菜单停止触发未直接点击<li>s

HTML/CSS : how do I make <p>s inside a <div> have different properties

html - Angular Material 日期选择器不会在模式对话框中打开

javascript - 使用 jQuery 滚动并捕捉到内部元素

javascript - function() 和 $(this) 中的 each()

html - 未设置div高度时如何使html表格高度=父div的高度

javascript - 查询/JS : Detect user's scroll attempt without any window overflow to scroll to

ios - UITableview scrollsToTop 按下 UINavigationbar

javascript - CouchDB 和 Cloudant 安全