danielad danielad - 1 year ago 124
jQuery Question

Remove modal property from Bootstrap modal window

How can you manipulate the modal dialog for bootstrap not to show it as modal window without the gray overlay.

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
<div class="modal-body">
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>

Answer Source

1) http://jsfiddle.net/ringstaff/Gbm89/14/ has a working example. All you have to do is add this line of css

.modal-backdrop {background: none;}

2) After modal initiation


just trigger the code below


3) add data-backdrop="false" to 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">

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download