Question

向下滚动时，导航栏的position为fixed。但它上面还有空间。如何让它自动转到顶端？

Answer 1

使用此CSS。这将解决您的问题。导航将位置更改为“绝对”。

nav {
float: left;
padding-left: 10px;
padding-top: 10px;
font-family: Georgia;
font-style: italic;
font-size: 20px;
position: absolute;
line-height: 30px;
}

Answer 2

为了实现这一目标，我总是使用JS。 jQuery让整个事情变得非常简单。我的<nav>正常定位，直到它碰到视口的上边缘。然后它得到＆＃34;固定＆＃34;添加到它的类，它将其固定为0 0.当向上滚动时，类会再次被删除，<nav>会回落到原始位置。

$(document).ready(function() {

    var navOffset = $('nav').offset().top;

    $(window).scroll(function() {
        if($(window).scrollTop() > navOffset) {
            $('nav').addClass('fixed');
        } else {
            $('nav').removeClass('fixed');
        }
    });

});

可以查看实时示例here。我想这就是你想要实现的目标？你的问题不太清楚。 [/无耻的自我推销]

导航栏自动转到顶部

2 个答案: