Bootstrap 模态框上下居中

在bootstrap.js里面找到Modal.prototype.adjustDialog在里面添加：

      // 是弹出框居中。。。var $modal_dialog = $(this.$element[0]).find('.modal-dialog');var m_top = ($(window).height() - $modal_dialog.height()) / 2;$modal_dialog.css({ 'margin': m_top + 'px auto' });

红色是需要添加的代码：

  Modal.prototype.adjustDialog = function () {var modalIsOverflowing = this.$element[0].scrollHeight > document.documentElement.clientHeightthis.$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 = ($(window).height() - $modal_dialog.height()) / 2;$modal_dialog.css({ 'margin': m_top + 'px auto' });}

转载于:https://www.cnblogs.com/xinbaba/p/9479462.html

Bootstrap 模态框上下居中相关推荐

解决bootstrap模态框居中问题
解决bootstrap模态框居中问题参考文章: (1)解决bootstrap模态框居中问题 (2)https://www.cnblogs.com/wutongvip/p/11442259.html ...
bootstrap模态框弹出居中显示
在项目中,有几个使用bootstrap模态框弹出问题,在单页面上是居中显示,但是嵌套在别的iframe中,弹出的位置在靠近顶部的位置. 查阅了一些资料,有几种解决方案,1修改bootstrap的js文 ...
bootstrap 模态框垂直居中实现方法
2019独角兽企业重金招聘Python工程师标准>>> this.$element.css({paddingLeft: !this.bodyIsOverflowing &&a ...
bootstrap模态框垂直居中显示
在用bootstrap模态框时,特别是小尺寸的模态框时,其显示位置接近屏幕顶端,在网上查找之后,找到了让模态框居中显示的实现.代码如下 function centerModals(){$('.moda ...
Bootstrap模态框使用WebUploader点击失效问题解决
Bootstrap模态框使用WebUploader点击失效问题解决参考文章: (1)Bootstrap模态框使用WebUploader点击失效问题解决 (2)https://www.cnblogs. ...
bootstrap 模态框满屏_如何设置Bootstrap模态框modal的高度和宽度?
以下图片是Bootstrap4模态框默认大小,一般情况Bootstrap模态框有两个默认大小,一个是"modal-sm" 小模态框,一个是"modal-lg"大 ...
bootstrap 模态框满屏_解决Ueditor在bootstarp 模态框中全屏问题
基本的一些配置就不说了.先说一下要注意的问题:首先是zIndex的设置.记住最好都显示设置模态框和ueditor的zIndex.理清他们的层叠关系. 特别是用到ueditor里面的图片上传功能的更要设 ...
前端之bootstrap模态框
简介:模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. Modal简介 Modal实现弹出表单 M ...
html遮罩层模态提示,页面遮罩层，并且阻止页面body滚动。bootstrap模态框原理，.bootstrap模态...
页面遮罩层,并且阻止页面body滚动.bootstrap模态框原理,.bootstrap模态实现思路: 1.需要有一个层将body遮住,放在body上方. 2.修改body的overflow属性值为 ...

Bootstrap 模态框上下居中

Bootstrap 模态框上下居中相关推荐

最新文章

热门文章