andi andi - 9 months ago 51
CSS Question

Bootstrap modal: how to fade in, but immediately disappear on close

In reference to Bootstrap 3 modals:

I use

class="modal fade"
on my outer modal div to create the default fade in/out effect of the Bootstrap modals. But what I really want to do is fade in, but not fade out. I want the modal to disappear immediately and completely when the close button is pushed, without any lingering CSS transitions.

How can I remove the CSS transition when the modal gets closed, but keep it when the modal gets opened?

Answer Source

Add a handler for the "" event, and in that handler, remove the fade class.

$('#myModal').on('', function (e) {

The transition defined by the fade class will then not occur.