Question

我对jQuery不是很有经验，所以我一直在努力解决我最近想要完成的事情。

我希望窗口底部的导航器在到达顶部时粘住。

What it should look like before and after scrolling.

我尝试了类似的方法：

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

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

Here is the entire HTML and CSS

非常感谢任何帮助，谢谢。

Answer 1

您需要做的就是检查要检查的元素的偏移顶部是否位于屏幕顶部。如果是，那么我们只需添加一个具有固定位置和前0的新类;

jsFiddle：https://jsfiddle.net/6jczdjdj/

$(function() {
  var distance = $('.navbar').offset().top,
    $window = $(window);

  $window.scroll(function() {
  $('.navbar').toggleClass('fixedtop', $window.scrollTop() >= distance)
  });
});

如何使导航在底部坚持到顶部

1 个答案: