"CenterVertical" 属性 没有将模态引导框定位在屏幕中央

Question

需要将模态引导框 window 垂直居中在屏幕中央，但“centerVertical”属性 不符合要求。 有谁知道如何解决这个问题？

谢谢:)

bootbox.dialog({
    message: "I am a custom dialog",
    title: "Custom title",
    //size: "large",
    //centerVertical: true,
    //backdrop: true,
    centerVertical: true,
    size: "small",
    buttons: {
        success: {
            label: "Success!",
            className: "btn-success",
            callback: function callback() {
                toastr.info("great success");
                alert('ok')
            }
        },
        danger: {
            label: "Danger!",
            className: "btn-danger",
            callback: function callback() {
                toastr.info("uh oh, look out!");
            }
        },
        main: {
            label: "Click ME!",
            className: "btn-primary",
            callback: function callback() {
                toastr.info("Primary button");
            }
        }
    }
});

Answer 1

centerVertical option is not implemented in the 4.x branch. You'll need to update Bootbox or add the Bootstrap class modal-dialog-centered你自己。

在 4.x 分支中实现此目的的方法很少。这可能是最简单的方法：

// assign the result of bootbox.alert to a variable
var d = bootbox.alert({
    message: "This is an alert, manually centered via <code>.modal-dialog-centered</code> on the vertical axis"
});

// `d` is a jQuery object, so we can chain additional function calls...
d.find('.modal-dialog').addClass('modal-dialog-centered');

jsFiddle: https://jsfiddle.net/3y26gpw9/1/

如果您希望所有模态都居中，您可以随时调整源以将相关 class 附加到模板，此处：https://github.com/makeusabrew/bootbox/blob/v4.x/bootbox.js#L39.