用于 IOS 不需要的功能的 Safari

Posted 2023-03-11

【中文标题】用于 IOS 不需要的功能的 Safari

【英文标题】：Safari for IOS unwanted features

【发布时间】：2016-06-01 07:50:24

【问题描述】：

这可能是一个随机的问题。我正在开发一个移动 Web 应用程序，我想尽可能多地给它一种原生应用程序的感觉。我的问题是我的网站上有一些元素应该在视口中垂直和水平居中，但 Safari 的 ios 浏览器快餐栏（见图）正在破坏外观。

（OBS这显然不是我的网页）

显示在浏览器底部的列表位于网站顶部，以便覆盖其内容。这是有问题的，因为发生这种情况时元素似乎不再居中。

我的问题是。无论如何都可以让小吃店向上推/压缩网站的内容而不是覆盖它吗？我真的不知道要谷歌什么。

谢谢

【参考方案1】：

所以听起来您想要恢复 minimal-ui 属性，但不幸的是 Apple 已将其删除。然而，一切都不会丢失，您可以做一些黑客攻击。

可能最流行的技巧是向下滚动一个像素，这样 Safari 会自动隐藏这些条。

版本 1：

window.scrollTo(0,1); 

版本 2：

/mobile/i.test(navigator.userAgent) 
&& !location.hash 
&& setTimeout(function() 
      window.scrollTo(0, 1);
    , 300);​

另一种选择是使用 3rd 方插件，例如 Brim，它可以强制屏幕旋转方向，然后极快地旋转回来。

【讨论】：

谢谢，这可能是一个解决方案。但是我不想隐藏栏。我只是希望他们表现得不同。现在它们显示在内容的顶部，覆盖页面。我想做的是让它们出现在页面下方，使屏幕更小/向上推而不是覆盖它。