使用固定导航发布滚动条

issue scrollto using fixed nav

本文关键字:滚动条 导航      更新时间:2023-09-26

我使用scrollto和scrollspy建立了一个单页网站。一旦导航条固定在顶部,页面就会很好地工作。但是如果你在导航栏固定到顶部之前点击任何链接,所有链接都会关闭。它们的高度没有一致性。我对偏移量进行了调整,我为每个部分设置了100px的内边距,以解决间距问题。

这是一个链接到开发网站…http://23.23.170.24/aspire/

这是js…

文档

$()时()函数{

$(window).scroll(function(){
    var window_top = $(window).scrollTop() +1; // the "12" should equal the margin-top value for nav.stick
    var div_top = $('#checkdiv').offset().top;
        if (window_top > div_top) {
           $('nav.navbar').addClass('navbar-fixed-top');
            $('section').addClass('scrolled');
        } else {
             $('nav.navbar').removeClass('navbar-fixed-top');
              $('section').removeClass('scrolled');
        }
});

$(".click").click(function(evn){
      evn.preventDefault();
     $('html,body').stop(true).scrollTo((this.hash, this.hash),1000, {axis: 'y', offset   :0});
      return false;
});
$('body').scrollspy({ target: '#navbar' })

});

当标题卡住时,Bootstrap scrollspyscrollto会自动考虑标题的高度。当打开时,你所要做的就是减去标题的高度,然后你就会滚动到页面上正确的位置。