使隐藏的div进而出现消逝？(Make hidden div appear then fade aw

是什么力量让一个div进而出现了几秒钟淡出的方式最简单的方法？

.fade_div {
    visibility: none;
    position: fixed;
    background-color: yellow;
    border: 1px solid black;
    top: 300px;
    left: 300px
}

<input type="button" value="Add Item" id="mybutton">

<div class="fade_div">Successfully Added!</div>

$('mybutton').click(function(){
    $('.fade_div').....
}

Answer 1:

下面的代码将与元素.fade_div类淡入迅速，等待1秒钟（1000毫秒）和淡出慢。

$('#mybutton').click(function(){
    $('.fade_div').finish().fadeIn("fast").delay(1000).fadeOut("slow");
});

您可能要停止使用visibility: hidden; （未无）和使用display: none代替。

瞬间的外观，而不是淡入：

$('#mybutton').click(function(){
    $('.fade_div').finish().show().delay(1000).fadeOut("slow");
});

的jsfiddle演示

Answer 2:

$('#btn').click(function(e){    
    $('#fancy').fadeOut('slow', function(){
        $('#bank').fadeIn('slow');
    });
});

FIDDLE DEMO

Answer 3:

这种直的问题：

采用：

$(".fade_div").fadeOut(1500, someFunctionCallAfterFadeDone);

了解更多关于它在这里

文章来源: Make hidden div appear then fade away?