javascript - jQuery导航在幻灯片上向上滚动，不起作用

有谁对我有解决方案，为什么它不起作用？
大多数网站让导航在向下滑动时消失，并显示您切换回去，在我的情况下，我尝试插入脚本，并尝试不影响HTML代码并使用现有功能，但没有任何效果。
剧本-

<script>
var previousScroll = 0,
headerOrgOffset = $('#header').offset().top;

$('target').height($('#header').height());

$(window).scroll(function() {
    var currentScroll = $(this).scrollTop();
    console.log(currentScroll + " and " + previousScroll + " and " + headerOrgOffset);
    if(currentScroll > headerOrgOffset) {
        if (currentScroll > previousScroll) {
            $('#header').fadeOut();
        } else {
            $('#header').fadeIn();
            $('#header').addClass('fixed');
        }
    } else {
         $('#header').removeClass('fixed');
    }
    previousScroll = currentScroll;
});
</script>

HTML-

<nav class="navi" id="target">
    <div class="menu" id="header">

        <li><a class="link-1" href="#">home</a></li>
        <li><a class="link-1" href="#">second</a></li>
        <li><a class="link-1" href="#">third</a></li>
        <div class="logo">
        <li><a href="#"><img alt="Brand" src="logo.png" height="40px" width="60px"></a><li>
        </div>

    </div>
<div class="handle"><p>menu</p></div>
    </nav>

最佳答案

演示：https://jsfiddle.net/66jk442L/

这是一种方法。

var timeout,
navbar = $('.navbar'),
    h = navbar.height();

$(window).scroll(function () {
    clearTimeout(timeout);
    if ($(this).scrollTop() > 100) {
        timeout = setTimeout(hideBar, 1200);
    } else {
        showBar();
    }
});

function showBar() {
    navbar.css('height', h);
    $('.navbar > *').show();
}

function hideBar() {
    $('.navbar > *').hide();
    navbar.css('height', 5);
}

navbar.hover(function () {
    showBar();
}, function () {
    clearTimeout(timeout);
    if ($(window).scrollTop() > 100) {
        timeout = setTimeout(hideBar, 1200);
    }
});

关于javascript - jQuery导航在幻灯片上向上滚动，不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30827926/