Bootstrap模态框垂直高度居中问题
生活随笔
收集整理的這篇文章主要介紹了
Bootstrap模态框垂直高度居中问题
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
Bootstrap對話框改變其默認寬高,高度不會自適應(yīng)居中。為解決這個問題,最好的方式是能夠通過css來解決,試了幾種網(wǎng)上的方案發(fā)現(xiàn)都不行。然后想到可以通過js來修正,什么時候修正最好?于是想到可以注冊全局的事件。
下表是Bootstrap官方的事件。
| 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. |
但是,我使用的是$(aa).modal('show'),所以改成這樣:
$(function () {//修正modal彈窗高度不能自適應(yīng)的問題$('body .modal').on('show.bs.modal', function () {var $cur = $(this);$cur.css("top", ($(window).height() - $cur.height()) / 2);}); });
?
轉(zhuǎn)載于:https://www.cnblogs.com/skybreak/p/6774433.html
總結(jié)
以上是生活随笔為你收集整理的Bootstrap模态框垂直高度居中问题的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Rails + React +antd
- 下一篇: Qt核心知识归类及相关资料