javascript – 移动固定顶部放大/缩小

2019年8月4日 177次阅读

我正在尝试为
HTML5中的移动设备实现固定的顶部栏,当用户放大/缩小网页时也会保持固定状态.

就我在Jquery移动设备上看到的那样,他们禁用放大/缩小以实现固定的顶杆.

谷歌制作了自己的内容滚动实现,以便为gmail应用程序制作固定的顶部栏.但他们也不允许变焦.

有谁知道这方面的解决方法？知道如果我们可以在放大/缩小时用js重新定位新区域顶部的栏吗？

更新：我发现这个post,其中有一个固定顶栏的示例,它不会禁用缩放,但是当您放大/缩小时它不会保持在顶部.

我也看到了the docs for Safari on IOs,但我找不到一种方法来获得新的缩放区域的相对位置,所以我可以在每次放大/缩小事件时重新定位它顶部的栏.

最佳答案 Apple已经实现了一个特殊的META标记来处理缩放：

<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库进行缩放：

希望这有帮助！