Question

我正在尝试使导航栏淡入并在用户向下滚动时固定。我只能把它变得粘稠，这不是我想要的。如何让它从滚动页面顶部淡入？

这是我到目前为止所做的

$(document).ready(function() {
    $(window).scroll(function() {
        if ($(this).scrollTop() > 110) {
            $('.navbar-light').addClass("fixed");
        } else {
            $('.navbar-light').removeClass("fixed");
        }
    });
});

https://jsfiddle.net/moerayan/DTcHh/25773/

基本上，我想要做的是，在滚动时，导航栏应该淡入并且不会粘住！

Answer 1

你在小提琴中所做的只是让导航栏变得粘稠。

因为我无法猜测你的html是怎样的。如果您使用的是插件，我可以这样说：

只有少量jquery

，你才能做到这一点

您指向的网站正在使用此插件来实现此效果。

https://github.com/markgoodyear/headhesive.js/

当然还有相关的html才能使其发挥作用。

此插件还有其演示站点，您可以在其中查看示例并使其按您的需要工作。

https://markgoodyear.com/labs/headhesive/

我希望这会帮助你。：）

如何在scroll-bootstrap上制作静态导航栏fadeIn

1 个答案: