Bootstrap對話框改變其默認寬高，高度不會自適應居中。為解決這個問題，最好的方式是能夠通過css來解決，試了幾種網上的方案發現都不行。然后想到可以通過js來修正，什么時候修正最好？于是想到可以注冊全局的事件。

　　下表是Bootstrap官方的事件。

Event TypeDescription

show.bs.popover	This event fires immediately when the?show?instance method is called.
shown.bs.popover	This event is fired when the popover has been made visible to the user (will wait for CSS transitions to complete).
hide.bs.popover	This event is fired immediately when the?hide?instance method has been called.
hidden.bs.popover	This event is fired when the popover has finished being hidden from the user (will wait for CSS transitions to complete).
inserted.bs.popover	This event is fired after the?show.bs.popover?event when the popover template has been added to the DOM.

Copy $('#myPopover').on('hidden.bs.popover', function () { // do something… })

　　但是，我使用的是$(aa).modal('show')，所以改成這樣：
　　 $(function () {//修正modal彈窗高度不能自適應的問題$('body .modal').on('show.bs.modal', function () {var $cur = $(this);$cur.css("top", ($(window).height() - $cur.height()) / 2);}); });

　　

?

轉載于:https://www.cnblogs.com/skybreak/p/6774433.html

總結

以上是生活随笔為你收集整理的Bootstrap模态框垂直高度居中问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。