bootstrap and bootbox: set dialog box center of the screen

Rocx picture Rocx · Jun 27, 2016 · Viewed 17.2k times · Source

I am using bootbox.js from http://bootboxjs.com/examples.html and it is quite impressive. But I have an issue while setting up the location of the dialog box.

I want to place dialog box center of the screen. I am using this code but dialog box stays on top of the screen.

 bootbox.alert('Danger!!').find('.modal-content').css({
     'background-color': '#f99',
     'font-weight': 'bold',
     color: '#F00',
     'top': '50%',
     'margin-top': function() {
         return -(box.height() / 2);
     },
     'font-size': '2em',
     'font-weight': 'bold'
 });

Please advise how can set the dialog box center of the screen.

Answer

Tieson T. picture Tieson T. · Apr 10, 2019

As of Bootbox 5, you can actually enable this via an option, centerVertical:

bootbox.alert({
    message: "I'm a vertically-centered dialog!",
    centerVertical: true
});