使用 jQuery .removeClass 淡出答案

【问题标题】：fadeOut with jQuery .removeClass使用 jQuery .removeClass 淡出
【发布时间】：2020-09-18 06:24:36
【问题描述】：

美好的一天！我是新来的！现在，对不起愚蠢:-)

功能：向下滚动时标题变为可见。滚动到顶部时隐藏。代码有效，但我无法使用 removeClass 进行软淡出。有人可以帮我吗？

<script type="text/javascript"> 
jQuery( document ).ready(function() {  

  var header_fixed = jQuery(".header-fixed")
  jQuery( header_fixed ).wrap( "<div class='header-f-wrapper'></div>" );
  var header_f_wrapper = jQuery (".header-f-wrapper");
  var height = jQuery(".et-l--header").height()+(20);


    jQuery(window).scroll(function(){ 
    if(jQuery(this).scrollTop()>height){
    header_f_wrapper.addClass("header-show");
    }
    else{
    header_f_wrapper.removeClass("header-show");
    }
  })
})
</script>
<style>
@keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}  
.header-f-wrapper {
display:none;
} 
.header-f-wrapper {
z-index: 999; /* display at the top */ 
position: fixed;
width:100%;  
top: 0;
-webkit-animation: fadein 0.9s ease-in; 
-moz-animation: fadein 0.9s ease-in;
animation: fadein 0.9s ease-in;
}
.header-f-wrapper.header-show {
display:block;
}}

}}
</style>

【问题讨论】：

标签： jquery css class

【解决方案1】：

你为什么不使用jQuery的fadeOut和fadeIn函数呢？ :https://api.jquery.com/fadeOut/，这是官方文档链接，在你的情况下，也许这可能有效：

    if(jQuery(this).scrollTop()>height){
      header_f_wrapper.fadeIn('slow',function(){
      //do something here
     }else{
           header_f_wrapper.fadeOut('slow',function(){
      //do something else here
         });
        }

我不知道这是否真的有效，因为我不知道具体情况，但我希望你能从中得到一些帮助

【讨论】：