Javascript Safari移动应用程序横幅更改视口高度

地址栏下方的横幅正在更改高度，甚至不是DOM的一部分

位置：底部的固定

元素被隐藏

您可以通过以下方式查看此内容：

在Safari-iOS智能手机中打开

向下滚动以查看此应用标题

点击

过滤方式

按钮

---

我有同样的问题，但这可能不是解决办法，而是一个解决办法

const updatePositionOfCtaButton = () => {
  if (
    window.navigator.userAgent.toLowerCase().includes('safari') &&
    window.navigator.userAgent.toLowerCase().includes('mobile') &&
    document.documentElement.clientHeight > window.innerHeight &&
    !document.hidden
  ) {
    document.querySelector('.callToActionButton').style.bottom = '44px';
  } else {
    document.querySelector('.callToActionButton').removeAttribute('style');
  }
}
window.addEventListener('scroll', updatePositionOfCtaButton);
document.addEventListener('visibilitychange', updatePositionOfCtaButton);

我们还可以在CTA按钮中添加

过渡

，以添加一些动画

.callToActionButton {
  transition: bottom 0.16s linear 0s;
}

---

您是否尝试过

-webkit fill可用

html{
高度：-可使用webkit填充；
}
身体{
显示器：flex；
弯曲方向：立柱；
保证金：0；
最小高度：100vh；
/*移动视口错误修复*/
最小高度：-webkit填充可用；
}
主要{
弹性：1；
}

标题在这里
这里有主管道
页脚位于此处

您找到解决方案了吗？我知道这与通用链接有关，但还没有找到一种方法来禁用或取消它。@TitoNobre不幸的是没有