Javascript jQuery ScrollTop（）函数动画菜单

我有一个小问题，我尝试使用jquery在导航栏中创建动画。 我的导航栏动画是这样的： 但我的问题是，只有当我在页面顶部时，动画才会开始。 但我需要动画开始时，用户从任何地方向上或向下滚动

我的Jquery代码：

$(document).ready(function () {
 $(window).scroll(function() {
   if ($(document).scrollTop() < 1) {
    $('nav').addClass('navYolo');
    $('nav').removeClass('navYo');
    $( "ul" ).show();
 } else {
    $('nav').removeClass('navYolo');
    $('nav').addClass('navYo');
    $( "ul" ).hide();
    }
  });
});

$（文档）.ready（函数（）{
$（窗口）。滚动（函数（）{
if（$（文档）.scrollTop（）<1）{
$（'nav'）.addClass（'navYolo'）；
$（'nav'）.removeClass（'navYo'）；
$（“ul”）.show（）；
}否则{
$（'nav'）.removeClass（'navYolo'）；
$（'nav'）.addClass（'navYo'）；
$（“ul”）.hide（）；
}
});
});

---

如果有人能帮我。非常感谢

您可以确定滚动方向并添加/删除导航类别

var lastScrollTop=0；
$（窗口）。滚动（功能（事件）{
var currentScroll=$（this.scrollTop（）；
if（$（this.scrollTop（）>lastScrollTop）{
$（'nav'）.addClass（'hidden'）；
}否则{
$（'nav'）.removeClass（'hidden'）；
}
lastScrollTop=currentScroll；
});
.wrapper{
高度：1000px；
背景：红色；
}
导航{
宽度：100%；
高度：50px；
背景：黄色；
位置：固定；
顶部：0px；
过渡：高度0.3s到0.0s；
-webkit过渡：高度0.3s；
-moz过渡：高度0.3s到0.0s；
}
导航隐藏{
身高：0；
}
我已经这样做了，在这里你可以准确地设置你想要的目标滚动值，甚至可以设置观看设备的宽度，一些你不想在移动f.e.上做的动画。
这是代码中最重要的部分，其余部分在链接中。
我添加了不透明度更改和转换函数，很抱歉没有使用原生JS，这其实很简单，但时间很短

$(document).ready(function(){
var previousScroll = 0;

$(window).scroll(function(){

var currentScroll = $(this).scrollTop();
 var screenWidth = $( window ).width();


if (currentScroll >= 0 && currentScroll < $(document).height() -    $(window).height() && screenWidth > 800){}

$（文档）.ready（函数（）{
var-previousScroll=0；
$（窗口）。滚动（函数（）{
var currentScroll=$（this.scrollTop（）；
var screenWidth=$（窗口）.width（）；
如果（currentScroll>=0&¤tScroll<$（文档）.height（）-$（窗口）.height（）&&screenWidth>800）{}

链接到代码笔

您想让标题始终显示在屏幕上吗？还是只在向下滚动时显示，但在向上滚动时不显示？也谢谢您的帮助，现在已经完成了：）