Inhibit modal window from closing on background click

Question

I am using Twitter Bootstrap, and I am creating a modal with a shaded background. I want the modal to stay up until I click close, and when someone clicks the background it will not close.

I can't find a solution. I know how to do with a backdrop, but then there is no background.

Answer 1

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

// by default backdrop: true so just set it to static.

Answer 2

In the modal, there is a data attribute called backdrop. You can set it to true or false:

data-backdrop="false"

You can also specify it as static if you want the backdrop but it should not close on clicking.

Another hack is to disable the backdrop and have your own backdrop with the following properties so that the modal doesn't close on clicking. CSS for the backdrop:

{
position:relative;
height:100%;
width:100%;
background:#000000;
opacity:0.2;
}