固定在Chrome移动设备上的位置导致元素向上/向下滚动

Question

我正面临着这个奇怪的问题，看起来像Chrome移动设备上的错误。

我有一个div位置：fixed;与屏幕的右上角对齐。在桌面上，它工作正常（它保持在原位），但在移动时，div向上或向下滚动时移动。我做了一个视频，以更好地解释：

https://www.youtube.com/watch?v=gCgN6ULkcMg

在精细

上滚动下来，用一块的div向上滚动作品位置：固定消失在视口外

我试图隔离小提琴上的问题，但无法重现它。于是我把整个网站封装在一个小提琴中，问题停止了。我仍然不明白为什么。

网站的小提琴隔离： 删除*

Live网站： 删除*

此外，我进行了不同设备上的一些测试，现场网站：

• Chrome行动：错误
• Chrome桌面：工程正常
• 火狐移动：做工精细
• 的Safari移动：做工精细

有人能解释我为什么Chrome移动设备上有这个问题，而其他人没有？

我的立场：固定股利看起来是这样的：

div { 
    position:fixed; 
    top:10px; 
    left:0; 
    width:100%; 
    text-align:right; 
} 

*删除的链接，因为它是一个客户的网站。解决方案在下面的答案中。

Answer 1

我发现了。

对于一些上帝遗弃的原因，我心爱的移动谷歌浏览器需要user-scalable = no在视口元。

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no"> 

现在有效。