2013-07-05 116 views
0

这不是一个关于独立于页面滚动的JQM面板的问题,虽然这是一个问题,我遇到了麻烦并且几乎要克服,这是关于使面板滚动顺畅并忽略设备浏览器的问题边缘事件(或任何正确的术语,我会在下面解释)。jQuery Mobile面板平滑滚动

基本上,我试图在谷歌的移动网站上复制菜单,这自然不像我们常见的民间那样使用JQM。我已经非常接近,但滚动动画非常僵硬。我需要它是基于动量的,而不是固定在你的手指上。

此外,当您到达菜单的顶部或底部时,它会被视为文档的极端,因此浏览器会将整个文档向上或向下移动以指示页面的边缘。相反,当面板打开时,页面不应该移动,并且菜单应该在面板内发生这种行为。

由于我已将面板高度设置为100%,因此这会在菜单打开时强制iOS Safari上的地址栏下降。这似乎正是Google上发生的事情,但如果有解决方法,我很乐意听到它。

最后,我模拟独立滚动的方式的一个缺点是只是在面板打开时将内容包装设置为固定。但是,这意味着面板打开时页面总是滚动到顶部。任何替代品,这将不胜感激。我想我可以将页面顶部设置为scrollTop或其他东西。

总结:

  • 面板菜单需要菜单上的平滑滚动(动量,而不是直接接触)
  • 弹性边缘,而不是窗口
  • iOS的Safari浏览器的地址栏与高度
  • 页面干扰当面板打开时固定在顶部

如果我的任何描述没有任何意义,只需访问goo gle.com在您的手机上并查看他们的菜单。

回答