css - 滚动并单击后导航在 Chrome 中消失

Question

我正在为即将发布的 Android 应用开发一个小网站，但我遇到了一个小问题，我似乎找不到答案。

在 Firefox 中，一切正常，但当您滚动然后单击导航链接时(只需使用 id 向下移动页面)但在 Chrome 中，导航会消失，直到您再滚动一些。

网站在 www.ioudebtcalculator.com

这些是我应用的唯一样式:

#navBar {
    background-color:#000;
    position:fixed;
    width:100%;
    font-family:sans-serif;
    font-weight:bold;
    font-size:13pt;
    height:70px;
}

编辑:我已经从网站上的导航栏中删除固定的位置，这样您就不会再在那里看到问题了。问题还没有解决。

您可以使用开发人员工具或任何其他等效工具轻松地将固定位置添加到 navBar 元素以查看问题。

Answer 1

将它添加到您的导航栏 css 时对我有用

-webkit-transform: translateZ(0);

成功了

#navBar {
    background-color: #000;
    width: 100%;
    position: fixed;
    font-family: sans-serif;
    font-weight: bold;
    font-size: 14pt;
    height: 70px;
    -webkit-transform: translateZ(0);
    z-index: 1;
    box-shadow: 0 2.5px 20px #000;
}