twitter-bootstrap 使用 jquery/css 淡出引导模式

Fade out bootstrap modal using jquery/css

提问by Fasna

I have a form inside a bootstrap modal. I awake it using jQuery $(modalId).modal('show');

我在引导模式中有一个表单。我使用 jQuery $(modalId).modal('show'); 唤醒它。

I don't want it to be fade in. So, I didn't add 'fade' class to my modal. upon submitting the form in modal. I want to fade out the modal.

我不希望它淡入。所以，我没有在我的模态中添加“淡入淡出”类。在以模态形式提交表单时。我想淡出模态。

$(modalId).modal('hide');

I used the above code segment to hide the modal, it works. But, the modal goes out very quickly. I want it to fade out for a few seconds. How can I achieve it?

我使用上面的代码段来隐藏模态，它有效。但是，模态很快就会消失。我希望它淡出几秒钟。我怎样才能实现它？

My code:

我的代码：

$('.save').on('click', function(){
 setTimeout(function(){

  $('#div_dbReadMany').modal("hide");

 }, 1500);
});

Fiddle

小提琴

采纳答案by Fasna

I found the solution by adding a delay to fadeout the modal and increased the time out on

我通过添加延迟淡出模态并增加超时时间找到了解决方案

$(modalId).modal('hide');

Code is here:

代码在这里：

 $('.save').on('click', function(){

  $('#div_dbReadMany').delay(1000).fadeOut(450);

  setTimeout(function(){
    $('#div_dbReadMany').modal("hide");
  }, 1500);

 });

回答by Jakir Hossain

Use this code.

使用此代码。

$('.save').on('click', function(){
   $('#div_dbReadMany').delay(1000).fadeOut('slow');
   setTimeout(function() {
       $("#div_dbReadMany").modal('hide');
   }, 1500);
});

DEMO

演示