Question

我有一个固定标题onscroll的以下javascript，但它在某些页面上的一个滚动后稍微跳转，并且它对于每个页面都是相同的CSS。 This page由于某种原因可以正常运行，但是other pages没有平稳过渡而且会跳下来：

<script>
$(document).scroll( function() {
    var value = $(this).scrollTop();
    if ( value > 48 ) {
        $(".header").css("position", "fixed");
        $("body").css("padding-top", "90px");
    } else {
        $(".header").css("position", "relative");
        $("body").css("padding-top", "0");
    }
});
</script>

CSS：

body {
background: #E9ECEF url("/images/light_bg.jpg") repeat;
background: #EEE;
padding-top: 0;
width: 100%;
height: 100%;
margin: 0 auto;
min-width: 250px;
font-size: 16px;
line-height: 1.7;
}

#top-nav-wrapper {
width: 100%;
background: #585864;
position: relative;
margin-top: 0px;
box-shadow: 0px 1px 1px 0px #B8B8B8;
top: 0;
z-index: 2000;
background: #EEE;
margin-bottom: 3px;
}

body, .header {
background: #EEE;
}
.header {
position: relative;
left: 0;
top: 0;
width: 100%;
min-height: 90px;
z-index: 2000;
background: #E9ECEF url("/images/dark_bg.jpg") repeat;
border-bottom: 1px solid #E4E4E4;
border: 0;
background: #EEE;
height: 90px;
background-color: rgba(238, 238, 238, 0.95);
box-shadow: 0px 1px 2px #C4C4C4;
}

任何想法都赞赏。

标题的平滑滚动转换

0 个答案: