将fadein添加到此.on函数中

Question

有没有办法可以将.fadein方法添加到以下jQuery代码中？;

目前，当您将鼠标悬停在.button div上时，它会显示另一个具有相应ID的div，但更改是即时的，看起来有点不稳定所以我想在每次转换之间添加一个漂亮的小淡入淡出

$(".button").on("mouseover",function(){
    $('div.tagline').hide();
    $('#tag-' + this.id).show();
});

Answer 1

尝试改变

 $('div.tagline').hide();
 $('#tag-' + this.id).show();

与

 $('div.tagline').fadeOut();
 $('#tag-' + this.id).fadeIn();

以这种形式写的fadeIn和fadeOut将同时执行（并行）：如果你想结束fadeOut然后执行fadeIn只是写

 var self = this;
 $('div.tagline').fadeOut(function() {
     $('#tag-' + self.id).fadeIn();
 });

Answer 2

试试这样：

$(".button").on("mouseover",function(){
    $('div.tagline').stop().fadeOut();
    $('#tag-' + this.id).stop().fadeIn();
});

如果它闪烁，您可能需要添加stop()方法。