Android Chrome浏览器地址栏移动固定元素hitarea [英] Android Chrome browser address bar shifts fixed element hitareas

问题描述

Android Chrome 似乎有一个相当大的错误，有时地址栏隐藏/显示会导致固定元素将它们的边界框向下/向上移动浏览器的地址栏高度.所以元素在视觉上保持在同一个位置，然而，边界框实际上发生了变化.这会使可点击区域变得无用，因为它们不再注册(见下图).

It seems Android Chrome has a pretty major bug where sometimes the address bar hiding/showing causes fixed elements to shift their bounding box down/up by the browser's address bar height. So the elements visually stay in the same spot, however, the bounding box actually shifts. This renders clickable areas useless as they don't register anymore (see images below).

该错误是间歇性的，但我已经能够通过快速滚动然后突然停止滚动触摸屏幕来非常可靠地复制它.有没有其他人遇到过这种情况，更重要的是，有没有人有避免这种行为的解决方案?

The bug is intermittent, but I've been able to replicate it pretty reliably by scrolling quickly and then abruptly stopping the scroll the touching the screen. Has anyone else encountered this and more importantly, does anyone have a solution that avoids this behaviour?

在第一张图片中，注意没有地址栏.它通过向下滚动隐藏.边界框是它应该在的地方.

现在有了地址栏，它会将整个边界框向下移动，在这种情况下是看不见的.这会使按钮的点击区域变得无用.

推荐答案

您是否尝试过将整个页面包装在具有固定位置的组件中?

Have you tried wrapping whole page in component that has fixed position?

我在 iOS 上遇到过这个问题，Safari 的底部栏隐藏了我们的内容，而这个修复对我们有用.

I've had this issue on iOS, where Safari's bottom bar was hiding our content, and that was fix that worked for us.

这篇关于Android Chrome浏览器地址栏移动固定元素hitarea的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！