移动固定TOPBAR在Zoom In/Out上



我正在尝试为HTML5中的移动设备实现固定的topBar ,当用户缩放/删除/删除/out 时,也可以保持固定网页。

据我在jQuery Mobile上看到的,它们将缩放输入/输出以实现固定的TOPBAR。

Google制作了自己的内容滚动实现,为Gmail应用程序制作了固定的TOPBAR。但是他们也禁止缩放。

有人知道对此有解决方法吗?知道我是否可以将JS放大/删除时,我是否可以将杠铃放在新区域的顶部?

更新:我找到了这篇文章,那里有一个固定顶部栏的示例,该栏目无法禁用Zoom,但是当您放大/缩放时,它不会停留在顶部。p>我还在iOS上看到了Safari的文档,但是我找不到一种方法来获得新的Zoomed区域的相对位置,因此我可以在每个Zoom In/Out事件中将标准放在其顶部。

苹果已经实现了一个特殊的元标记来处理Zooming:

<meta content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">

这也可以在iPhone上放大,并且也应在Android上使用。

至于您所需的缩放效果,我的建议是完全禁用缩放,并使用jQuery和CSS WebKit过渡和动画进行100%的缩放。

#some-div {
    -webkit-transition: all 0.5s ease-out;
}

这还有其他一些可做缩放的jQuery库:

  • http://flwtb.co/vktq1c
  • http://flwtb.co/vkttdw

希望这会有所帮助!

i通过添加

解决了固定位置和Zoom之间的冲突
"data-disable-page-zoom="false""

到固定标签。希望这可以有所帮助。

最新更新