小编Tom*_*oun的帖子

如何在窗口滚动上为导航栏设置动画

我想问一下是否有办法使用jQuery animate()方法在窗口滚动上为水平导航栏的top属性设置动画.

这是我使用的代码:

window.addEventListener("scroll", function() {
if (window.scrollY > 200) {
    $('#navbar').css({top:"100px"});
}
else {
    $('#navbar').css({top:"0px"});
}
},false); 
Run Code Online (Sandbox Code Playgroud)

CSS:

#navbar{
top:0;
position:fixed;
transition: top 0.5s;
}
Run Code Online (Sandbox Code Playgroud)

当您向下滚动200px时,导航栏会将其顶部位置从0更改为100px; 这工作正常,但如果我改变方法并把.animate而不是.css,

$('#navbar').animate({top:"100px"});    
Run Code Online (Sandbox Code Playgroud)

它停止工作.有什么想法吗?

javascript css jquery css3

4
推荐指数
1
解决办法
5896
查看次数

标签 统计

css ×1

css3 ×1

javascript ×1

jquery ×1