Javascript 引导4智能卷轴

我正在使用基本教程在滚动条上显示/隐藏标准BS4导航栏，它对桌面非常有用

然而，在移动设备上，向下滚动导航栏，然后返回顶部时，导航栏的行为有点奇怪。返回顶部后，导航栏将再次隐藏

我怀疑这个问题与

scrollTop（）

有关，但似乎无法解决这个问题

以下是我的JS：

    if ($('.smart-scroll').length > 0) { // check if element exists
        var last_scroll_top = 0;
        $(window).on('scroll', function() {
            var scroll_top = $(this).scrollTop();
            if(scroll_top < last_scroll_top) {
                $('.smart-scroll').removeClass('scrolled-down').addClass('scrolled-up');
            } else {
                $('.smart-scroll').removeClass('scrolled-up').addClass('scrolled-down');
            }
            last_scroll_top = scroll_top;
            /* Tried to catch for scroll_top zero, but doesn't help */
            if(scroll_top == 0) $('.smart-scroll').removeClass('scrolled-up');

        });
    }

我也尝试合并stackoverflow，但仍然无法使其工作

---

有什么想法可以在手机上运行吗？

在我的实践中也有类似的想法。从那里获取代码并根据您的案例进行调整

if ($('.smart-scroll').length > 0) {

        var lastScrollTop = 0;
        $(window).scroll(function() {    

            var scroll_top = $(window).scrollTop();

            if (scroll_top > 1) { // think, this will work a little bit better to catch scrolltop more then 0(1)
                $(".smart-scroll").addClass("stick");
            } else { 
                $(".smart-scroll").removeClass("stick");
            }

            if (scroll_top > lastScrollTop){
                $(".smart-scroll").removeClass("scrolled-up");                      
            } else {
                $(".smart-scroll").addClass("scrolled-up");
            }                       
            lastScrollTop = st;

    });

}   

和CSS

.smart-scroll {
    position: fixed !important;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1000;
    transition: all 0.3s ease-in-out;
    transform:translateY(0);
}
.stick {transform:translateY(-100%);}
.scrolled-up {transform:translateY(0) !important;} 

---

我在if/else语句下面添加了这个，以防止隐藏在最顶端

if(scroll_top <= 0) {
   $('.headerContainer').removeClass('scrolled-up').removeClass('scrolled-down');
}

---

if（滚动）\u top真棒！非常感谢。
if(scroll_top <= 0) {
   $('.headerContainer').removeClass('scrolled-up').removeClass('scrolled-down');
}