在addclass/removeclass事件上添加淡入或淡出 [英] Add fade-in or fade-out on the addclass / removeclass event

问题描述

我是初学者，请不要对我粗暴.

I am a beginner, please don't be to rough with me.

我创建了一个addclass和removeclass事件:

I created an addclass and removeclass event :

$(".myclass").click(function(){
   $(".hiding").removeClass("hiding");
   $(this).addClass("hiding");
});

这是CSS:

#wrapper a.hiding {
   display: none; 
}

还有HTML:

<div id="wrapper">
<a class="myclass" href="#2">
    <img src="">
</a>
</div>

所以暂时来说，它工作正常，但是我想在addclass时添加一个淡入动作，在removeclass时添加一个淡入动作 我用

So for the moment, it works fine, but I would like to add a fade-in action when addclass, and fade-out when removeclass I tried by the CSS using

 -webkit-transition: all 0.5s ease;

但是它不起作用.

推荐答案

我建议您尝试此

我刚刚意识到使用fadeIn()更好，请尝试以下方法:

edit: I realized just now using fadeIn() is better, try this:

$(".myclass").click(function(){
   $(".hiding").fadeOut('slow', function() {
       $(".hiding").removeClass("oldStuffHere");
       $(this).addClass("newStuffHere");
       $(this).fadeIn('slow', function() {
           // Animation complete
            });
      });

});

这篇关于在addclass/removeclass事件上添加淡入或淡出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！