Menu
I am using bootstrap modal. The triggrer is like this:
<a id="add-feed-button" role="button" data-toggle="modal" href="#add-feed-form" class="btn pull-right btn-success" style="margin-left:5px; margin-top:-4px;">Add new</a>
and my modal:
<div id="add-feed-form" class="form-feed modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
this is modal.
</div>
Problem is that only the backdrop becomes black but no modal appears.
I have included bootstrap.js and also bootstrap.min.css. I have used modals quite a times but this is a strange problem.
455
The key idea is to have pointer-events: none; for the body when modal is open. But the specific elements you want to be interacted with should have e.g. pointer-events: auto; . In the example you can click both buttons when dialog is hidden, but only Toggle Dialog button when dialog is shown.
The backdrop option specifies whether the modal should have a dark overlay (the background color of the current page) or not.
Remove .hide class from div#add-feed-form and then it will work fine.
Demo
171
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
