bootstrap css - how to make a modal dialog modal without affecting the background

add data-backdrop="false" to <div class="modal"> and Bootstrap will do the rest.

Example:

<div class="modal" id="genericModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="false">

To get rid of the backdrop:

After modal initiation

$('#XXX').modal({show:true});

just trigger the code below

 $('.modal-backdrop').removeClass("modal-backdrop");

The correct way is to pass the param backdrop: false when create the modal

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

Related