javascript - 如果正文没有滚动，有没有办法隐藏滚动浏览器？

Question

我有一个页面，它有一个中心 div，它是所有内容的守护者(我需要这个来使页面居中并有一个持久的顶部和底部导航)，但是，我现在无法做到的是在移动浏览器中向下滚动时将地址栏滑开(就像页面本身滚动一样)。因为滚动的是div的内容，所以浏览器地址栏一直存在。

我很好奇，当此 div 从其顶部坐标向下滚动时，我是否可以发出手动命令来执行浏览器元素的所述隐藏/显示。

我只关心在 webkit、safari、firefox 和 chrome 等现代移动浏览器中实现这项功能。

Answer 1

如果您的目的是让地址栏在桌面浏览器上固定位置(不滚动)，但在移动浏览器上静态(滚动)，您可以使用媒体查询。

例子

html

<div id="address-bar">
    <!-- content -->
</div>

CSS

#address-bar{
    position: fixed;
    top: 0;
}

// on lesser width (mobile screen) it will override above rule
@media (max-width: 480px) {
    #address-bar{
        position: relative;
    }
}