如何在bootstrap模式中使用animate.css？

Question

我在bootstrap中使用模态。我希望当我在模态对话框中单击关闭按钮时它会随着动画=＆＃34;而消失。铰链＆＃34;在animate.css中指定。如何实现？

<div class="modal " id="call" role="dialog">
    <div class="modal-dialog">
            <div class="modal-content">
                    <div class="modal-header">
                    <h4>Call Us At</h4>
                    </div>

            <div class="modal-body">
                    <pre>
                        Landline: 34343434
                        Mobile  : 343434343434
                        </pre>
                    </div>

            <div class="modal-footer">
                    <button class="btn btn-danger "  data-dismiss="modal">Close</button>
                    </div>
                </div>
        </div>
</div>

<div class="row" style="margin-top:100px;">
   <div class="btn-group btn-group-justified">
    <div class="btn-group"><a class="btn btn-success" href="#call" data-toggle="modal">CALL US</a></div>
  </div>
</div>

Answer 1

尝试此解决方案Demo URL

$(document).on('hide.bs.modal','#myModal1', function (e) {
    $('#myModal1').addClass("animated hinge");
    $('.modal-backdrop').hide();
    return e.preventDefault();
});