Bootstrap模态框实现垂直居中——修改bootstrap的js
投稿于 被查看 40078 次 评论:137
Bootstrap模态框实现垂直居中——修改bootstrap的js
bootstrap的默认弹窗垂直方向是不居中的,试验了几种方案,如下这个方案比较成功
在bootstrap的js中
搜索关键词“ Modal.prototype.adjustDialog ” 找到相应代码段
修改成如下内容
Modal.prototype.adjustDialog = function () { var modalIsOverflowing = this.$element[0].scrollHeight > document.documentElement.clientHeight this.$element.css({ paddingLeft: !this.bodyIsOverflowing && modalIsOverflowing ? this.scrollbarWidth : ‘‘, paddingRight: this.bodyIsOverflowing && !modalIsOverflowing ? this.scrollbarWidth : ‘‘ }) // 是弹出框居中。。。 var $modal_dialog = $(this.$element[0]).find(‘.modal-dialog‘); var m_top = ( $(document).height() - $modal_dialog.height() )/2; $modal_dialog.css({‘margin‘: m_top + ‘px auto‘}); }
用户评论