Javascript 当div为display none时jQuery addClass removeClass动画

当div为display:none时，是否可以将jQueryaddClass与动画结合起来

jQuery

 $(window).scroll(function() {
        $(this).scrollTop() > 100 ? $(".nav-current").addClass("hide") : $(".nav-current").removeClass("hide");
        $(this).scrollTop() > 100 ? $(".nav-affix").addClass("show") : $(".nav-affix").removeClass("show");
        $(this).scrollTop() > 50 ? $(".navbar").addClass("go-top navbar-fixed-top") : $(".navbar").removeClass("go-top navbar-fixed-top");
    });

CSS

.show {
    display: block;
}

.hide {
    display: none;
}

.nav-affix {
    display: none;
    > li {
        > a {
            font-size: 12px !important;
            transition: all 0.3s;
        }
    }
 }

---

同意fauxserious——您可以使用fadeIn和fadeOut jQuery函数来实现您的目标

另外一个选项是使用

width（1000）

和

height（1000）

，其中参数（1000）是以毫秒为单位的持续时间，因此可以获得一些动画

---

如果您仍然有问题，请告诉我。

因此，您不是真的询问jQuery，而是询问CSS

transition

和

display:none

？是的，但是display:property不使用transition。第二种解决方案可见性：隐藏；不透明度：0；但在这种情况下，这不是一个解决方案。您尝试过jQuery

.fadeIn（）

和

.fadeOut（）

而不是转换吗？您好@Vnuuk。谢谢你的回答。但我不知道你的确切意思。因为我使用这个脚本来显示和隐藏导航栏内部内容。当我向下滚动时，如果没有一些动画，看起来就不太好。我正在尝试添加.animate（{opacity}）。。但是不起作用。我创造了一个新的世界。谢谢