javascript - 触摸设备上的 CSS vh 单元问题

Question

有没有办法阻止触摸设备上的调整大小行为？我的问题是，如果我有一个高度为 60vh 的部分。此部分位于页面顶部。当用户开始滚动时，地址栏从窗口中消失，浏览器刷新 vh 单元(如果我没记错的话)。

index.html

<section class="top-section">
 <!-- lots of code here -->
</section>

样式.css

.top-section {
  height:60vh;
}

有没有办法在 CSS 中解决这个问题，或者没有其他方法只能使用 Javascript。

Answer 1

如果您正在谈论创建顶部栏(带有导航按钮和其他东西)，隐藏固定元素的最正确方法是使用 JS。

你有两个选择:

选项 1) 有相对的顶栏。当你滚动时它会隐藏
选项 2) 修复它，但使用监听器 (scrollTop()) 来决定何时打开/关闭顶部栏。