Question

这只发生在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>

固定导航跳转时-webkit-overflow-scrolling：touch;

0 个答案: