wordpress 隐藏菜单的滚动高度

fnatzsnv  于 2022-12-03  发布在  WordPress
关注(0)|答案(3)|浏览(170)

我有这个代码来隐藏和显示菜单滚动时。我怎么能这样做,以出现类只有滚动〉= 500 px。我已经跟踪到广告,如果(滚动〉= 500)的代码,但它不会工作。

jQuery(document).ready(function( $ ) {
// console.log($);

       var lastScrollTop = 200;

$(window).scroll(function(event){
    var st = $(this).scrollTop();
    if (st > lastScrollTop){
        $('nav').addClass('nav-off');
        $('nav').removeClass('nav-on');
    } else {
        $('nav').addClass('nav-on');
        $('nav').removeClass('nav-off');
    }
    lastScrollTop = st;

});

});

pepwfjgg

pepwfjgg1#

最后一部分的代码说明工作,它超过了第一部分,并不会尊重500px的最小高度添加类。
这是不会让其他工作的部分。如果我删除它,它只工作在500ps显示和隐藏。滚动到顶部的部分只应该在你向下滚动500px。

var lastScroll = 0;
$(window).scroll(function (event) {
var scrollTop = $(this).scrollTop();
if (scrollTop > lastScroll) {
    $('body').addClass('nav-on');
    $('body').removeClass('nav-off');
} else if (scrollTop < lastScroll) {
    $('body').removeClass('nav-on');
    $('body').addClass('nav-off');
} else {

}
lastScroll = scrollTop;
});
uqzxnwby

uqzxnwby2#

var lastScroll = 0;
$(window).scroll(function (event) {
var scrollTop = $(this).scrollTop();
if (scrollTop > lastScroll) {
    $('nav').addClass('nav-on');
    $('nav').removeClass('nav-off');
} else if (scrollTop < lastScroll) {
    $('nav').removeClass('nav-on');
    $('nav').addClass('nav-off');
} else {

}
lastScroll = scrollTop;
});

您应该更改导航类名而不是主体

t30tvxxf

t30tvxxf3#

向下滚动超过500px时下方代码显示按钮向上滚动时隐藏,
希望它的帮助
Screen CaptureScreen Capture显示器

var offset = 500
    $(window).on('load scroll', function () {

    if ($(window).scrollTop() > offset) {
        $('body nav').addClass('nav-on');
        $('body nav').removeClass('nav-off');

    } else if ($(window).scrollTop() < offset) {
        $('body nav').removeClass('nav-on');
        $('body nav').addClass('nav-off');

    }

});

var lastScroll = 0;
$(window).scroll(function (event) {
    var scrollTop = $(this).scrollTop();
    if (scrollTop > lastScroll) {
        $('body nav').removeClass('up');
        $('body nav').addClass('down');

    } else if (scrollTop < lastScroll) {
        $('body nav').addClass('up');
        $('body nav').removeClass('down');
    } else {

    }
    lastScroll = scrollTop;
});

您的CSS将使用相同的

nav.nav-off {
    top: -120px;
    background: transparent;
}

nav.nav-on {
    top: 0;
}

你可以多写两个上下

nav.down {
  
}

nav.up {
   
}

相关问题