modal-dialog的弹框居中
在做项目时候,需要将bootstrap的modal dialog居中,便查询,网上说直接修改源代码即可
that.$element .show() .scrollTop(0) that.adjustDialog() if (transition) { that.$element[0].offsetWidth // force reflow } that.$element.addClass('in') //2015.11.24 modify by lsp modal dialog align center var $modalDialog = that.$element.find(".modal-dialog") var dialogHeight = $modalDialog.height() var windowHeight = $(window).height() // When dialog height greater than window height, // use default margin top value to set dialog position. // if (windowHeight < dialogHeight) { // do nothing // return; // } // When dialog height less than window height, // use margin top set it position. // Dialog position set it with vertical center. if (windowHeight > dialogHeight) { $modalDialog.css({ "marginTop": ( windowHeight - dialogHeight) / 2 }); } //end that.enforceFocus() var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
有时候需要修改modal的属性
$(document).ready(function(){
$('#myModal').modal("hide");
$('#myModal').on('show.bs.modal', function() {//捕获show事件
var dialogWidth = $('.modal-dialog img').get(0).width;
var dialogHeight = $('.modal-dialog img').get(0).height;
$('.modal-dialog').css({
"width":dialogWidth,
"height":dialogHeight
});
})
});