jQuery Bootstrap 3 警报通过动画解除
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20863035/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap 3 alerts dismissed with animation
提问by codeninja
Is there a way to make dismissed alert in bootstrap have an animation like fade out?
有没有办法让引导程序中的已解除警报具有淡出之类的动画？
I added the class .fadeto the code:
我将类添加.fade到代码中：
<div class="alert alert-info fade alert-dismissable">
<p><b>Gracias</b> por ponerte en contacto! Responderé a tu correo lo más pronto posible.</p>
</div>
But it doesn't work. Any help will be appreciated!
但它不起作用。任何帮助将不胜感激！
采纳答案by Ahm3d Said
you can omit the data-dismiss attribute
您可以省略 data-dismiss 属性
<div class="alert alert-warning alert-dismissable">
<button type="button" class="close" aria-hidden="true">×</button>
<p>animated dismissable</p>
</div>
and use the following jQuery
并使用以下 jQuery
$(".alert button.close").click(function (e) {
$(this).parent().fadeOut('slow');
});
or if you want clicking anywhere to close the alert use
或者如果你想点击任何地方关闭警报使用
$(".alert-dismissable").click(function (e) {
$(this).fadeOut('slow');
});
回答by guest
you can add '.in' class, alert fade out.
您可以添加“.in”类，警报淡出。
<div class="alert alert-info fade in">
<a class="close" data-dismiss="alert" href="#">×</a>
<p>message</p>
</div>
回答by zgood
$('.alert-dismissable').fadeOut();or assign a css3 fade out animation to your fade class and apply it to the <div>when you want it to fade out.
$('.alert-dismissable').fadeOut();或者为您的淡入淡出类分配一个 css3 淡出动画，并将其应用于<div>您希望它淡出的时间。
回答by Pavel Dubinin
You can listen to close.bs.alertevent to use custom effects:
您可以监听close.bs.alert事件以使用自定义效果：
$(function(){
$('body').on('close.bs.alert', function(e){
e.preventDefault();
e.stopPropagation();
$(e.target).slideUp();
});
});
See in action at https://jsfiddle.net/6s8dgh72/8/
