Javascript 有没有一种方法可以在不使用负像素值的情况下轻松地进出动画div?

Javascript 有没有一种方法可以在不使用负像素值的情况下轻松地进出动画div?,javascript,jquery,css,animation,jquery-easing,Javascript,Jquery,Css,Animation,Jquery Easing,我希望导航栏在某个锚点上轻松进出。我已经完成了任务,但是我发现在动画发生时滚动会由于负像素值和文档顶部而中断动画。有没有办法让导航使用我设置的动画,而不使用负像素值来隐藏和显示它 我尝试了.show/.hide选项,其可见性为:hidden;,但我似乎不知道如何将它们与动画结合起来 var t=$about.offset.top; $window.scroll函数{ 如果$document.scrollTop>=t{ $'global-nav'.stop.animate{top:'0px'},

我希望导航栏在某个锚点上轻松进出。我已经完成了任务,但是我发现在动画发生时滚动会由于负像素值和文档顶部而中断动画。有没有办法让导航使用我设置的动画,而不使用负像素值来隐藏和显示它

我尝试了.show/.hide选项,其可见性为:hidden;,但我似乎不知道如何将它们与动画结合起来

var t=$about.offset.top; $window.scroll函数{ 如果$document.scrollTop>=t{ $'global-nav'.stop.animate{top:'0px'},500,'easeOutBounce'; }否则{ $'global-nav'.stop.animate{top:'-50px'},500,'easeinfo'; } }; html{高度:2000px;} 全球导航{ 高度:50px; 背景:2000人; z指数:9999; 位置:固定; 左:0; 顶部:-50px; 宽度:100%; 颜色:fff; 文本对齐:居中; } 全球导航p{ 边缘顶部:15px; } 关于{ 边缘顶部:600px; } 导航


实际上,你的动画使用了缓和效果,因此看起来有点犹豫,但是如果你在隐藏项目时移除了缓和效果,那么它看起来会窒息;例如:

// Without "easeInExpo" easing effect
else {
    $('#global-nav').stop()
    .animate({top: '-50px'}, 500);
}

你能重新表述一下吗?我发现在动画发生时滚动会因为负像素值而中断动画?不清楚。很抱歉。我想问题主要出在回卷时的动画上。如果用户一直向上滚动,动画会出现犹豫/结巴,因为它试图找到要进行动画备份的文档顶部。我增加了一个更大的利润率,所以你有希望明白我的意思。我不得不同意。非常感谢。我喜欢效果上的轻松,但这是问题的根源。这就是为什么我很好奇,除了使用负像素值,是否还有其他方法隐藏导航,但现在这是一个很好的修复方法。我感谢你的帮助!不客气,我已经在评论中提供了一个更新的例子,可能你没有注意到:-啊,是的,我现在明白了。再次感谢!