Symptoms
Upon calling .modal(), I ended up with a very dark background overlay. Dismissing the modal cause the overlay to lighten but remain. Clicking somewhere on the page or pressing ESC caused the overlay to vanish.
Method
This was occurring whenever I loaded the entire content of the modal with AJAX. Something like:
function makeModal(html) { var $modal = $(html); $('body').append($modal); $modal.modal(); }
The problem is that html had a script tag present, so $modal.modal(); was actually being applied to the modal div and the script tag.
The Fix
You need to make sure you only apply modal() to the modal div, like this:
function makeModal(html) { var $modal = $(html); $('body').append($modal); $modal.filter('.modal').modal(); }
I found the answer to this problem via landon's post on this github issue: https://github.com/twitter/bootstrap/issues/679