CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrapbootstrap-modal
membersound
membersound

Reputation: 86865

How to hide a modal popup without backdrop?

I'm triggering the following modal dialog from javascript:

$('#myModal').modal({
    show: true,
    backdrop: false
});

Result: the dialog shows up, but is not closed if I click outside of the popup.

When I set backdrop: true, the dialog is closed on outside click, but the full screen appears with a dimmed overlay.

How can I have a modal popup that does not change the opacity overlay, but still closes on outside click?

Upvotes: 1

Views: 349

Answers (3)

scniro
scniro

Reputation: 16989

You could add a background-color to .modal-backdrop as such...

<style>
    .modal-backdrop {
        background-color: transparent;
    }
</style>

<!-- [...] -->

<script>
    // [...]
    $('#myModal').modal({
        show: true
    });
</script>

Plunker link - demo

Upvotes: 1

Oscar LT
Oscar LT

Reputation: 797

$('#myModal').modal({backdrop: 'false', keyboard: false})

http://jsfiddle.net/obewgqc8/

Upvotes: 0

volx757
volx757

Reputation: 163

You can leave backdrop:false, and add your own click event to the page:

$('body').click(function(e){
   if ($('#myModal').is(e.target))
       $('#myModal').modal('hide') //or whatever your bootstrap uses to hide a modal
})

Upvotes: 0

Related Questions