Bootstrap 3 - 3秒后如何淡入警报框点击和淡出

Question

我正在使用AngularJS和Bootstrap 3.我的网络应用程序有一个"更新"按钮,用于保存用户所做的任何更改.当用户点击"更新"按钮时,我想激活并淡入引导程序的警告框,说"已保存信息",然后在3秒后淡出.我不知道如何创建这个功能,可能需要一些帮助..

更新:

我决定使用这种方法:

HTML

<button type="button" class="btn btn-info" ng-click="save()">Update</button>

<div id = "alert_placeholder"></div>

JavaScript的

$scope.save = function() {
    $('#alert_placeholder').html('<div class="alert alert-warning alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button><span>Your information has been updated.</span></div>')
    setTimeout(function() {
        $("div.alert").remove();
    }, 3000);
}

我希望在第一次出现时使警报框淡入淡出,并在3秒后将其删除,但是我不知道如何使其与我的代码一起使用.

Answer 1

我用的是这样的东西.(动画看起来很漂亮!).只需添加此JS,并将该类flash应用于您想要消失的每个项目.请务必将您的课程添加fade-in到一切!该fade-in课程附带引导程序.它将在5秒后淡出.

window.setTimeout(function() {
  $(".flash").fadeTo(500, 0).slideUp(500, function(){
      $(this).remove();
  });
}, 5000);