bootstrap-modal
bootstrap-modal copied to clipboard
Initial Click Modal Load Half Bottom Screen
Hi, In using
.modal-body { width: auto; max-height: 600px; height: auto; }
.modal { z-index: 1050; max-height: 700px; width: 700px; background-color: #ffffff; }
On page load, the first click to launch the modal, due to dynamic height, it launches the modal in the middle of the screen where part bleeds off the screen. Close it, click on same link, it load top of screen correctly. Close it, click on same link, it load back to middle of screen with part bleeding off.
Anyone experiences this? Seems to ONLY occur with this boostrap-modal. If disable and use original (none-stackable) bootstrap, no issue.
You can use the modalOverflow
option for highly dynamic modals. This options tells the modal to render the modal as if it's always going to be larger then the view.
<div class="modal" data-modal-overflow="true">...</div>
Your other options would be to wait until the contents of the modal are loaded before calling .modal()
, set an explicit height for the modal, or call $element.modal('layout')
to re-position the modal when content has changed.
Yes, I experience the same issue but only in Internet Explorer (v9). Not sure if it happens in IE 7/8 but I would assume so.
Seems when you initially click on the link for the modal window it loads off center near the bottom of the page. If I close the modal window and re-click the link, it loads in the correct middle position (the default bootstrap position).
The fix suggestions above only work if you want to specify the location, not if you want to use the default behavior.
It happens to me on CHrome and Firefox latest version
-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- http://www.photographybykevin.net -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
From: "Justin@" [email protected] To: jschr/bootstrap-modal [email protected] Cc: smilepak [email protected] Sent: Thursday, August 8, 2013 8:05 AM Subject: Re: [bootstrap-modal] Initial Click Modal Load Half Bottom Screen (#151)
Yes, I experience the same issue but only in Internet Explorer (v9). Not sure if it happens in IE 7/8 but I would assume so. Seems when you initially click on the link for the modal window it loads near off center near the bottom of the page. If I close the modal window and re-click the link, it loads in the correct middle position (the default bootstrap position). The fix suggestions above only work if you want to specify the location, not if you want to use the default behavior. — Reply to this email directly or view it on GitHub.
Can you check if this goes away when you do following:
- include minimum bootstrap or as per your requirement but do no include modal javascript
- include this plugin modal js
- include bootstrap modal js at the end and then test
data-modal-overflow="true" works for me