Html 固定导航跳跃时-webkit溢出滚动：触摸；_Html_Ios_Css_Webkit

Html 固定导航跳跃时-webkit溢出滚动：触摸；

html ios css

Html 固定导航跳跃时-webkit溢出滚动：触摸；,html,ios,css,webkit,Html,Ios,Css,Webkit,这只发生在IOS上的Safari上我已经申请了 body { font-family: helvetica, verdana, sans-serif; background: #fff; overflow: auto; height: 100%; overflow-y: scroll; /* I added this */ -webkit-overflow-scrolling: touch; /* and also this */ } 这是因为

这只发生在IOS上的Safari上

我已经申请了

body {
    font-family: helvetica, verdana, sans-serif;
    background: #fff;
    overflow: auto;
    height: 100%;
    overflow-y: scroll; /* I added this */
    -webkit-overflow-scrolling: touch; /* and also this */
}

这是因为我想在手机上实现平滑滚动（IOS上的Safari）。但在完成这项工作之后，我引入了一个新的bug，当我滚动时，我的导航现在并没有被修复。滚动停止后，它会跳转并更新其位置

这是导航的css

.nav-bar {
    background-color: #ff0000;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 51px;
    z-index: 1030;
    max-height: 51px;
}

.nav-container {
    margin: 0 auto;
    height: 51px;
    max-width: 1170px;
    width: 100%;
}

html是

<body class="home">

    <div class="nav-bar">

        <div class="nav-container">

        </div>

    </div>

    <div class="content">
        <p>content here</p>
    </div>

</body>


满足于此

您找到解决方案了吗？我也有类似的问题