zoukankan      html  css  js  c++  java
  • Bootstrap modal 模态框垂直居中显示补丁

    <script>
        $.fn.modal.Constructor.prototype.adjustDialog1 = 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 : '' });
    /**设置弹出框垂直居中start**/ var $modal_dialog = $(this.$element[0]).find('.modal-dialog'); // 获取可视窗口的高度 // var clientHeight = (document.body.clientHeight > document.documentElement.clientHeight) ? document.body.clientHeight: document.documentElement.clientHeight; // 得到dialog的高度 var dialogHeight = $modal_dialog.height(); //计算出距离顶部的高度 var m_top = (document.documentElement.clientHeight - dialogHeight)/2; $modal_dialog.css({'margin':m_top + 'px auto'}); /**设置弹出框垂直居中end**/ } </script>

    红色部分为我们的处理逻辑,绿色部分为Bootstrap原生的处理函数,直接拷贝:

    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 : ''
        })
    }

    via:https://blog.csdn.net/yucaifu1989/article/details/51425424

  • 相关阅读:
    Java中用Apache POI生成excel和word文档
    openlayers实现画圆
    openlayers实现wfs属性查询和空间查询
    jquery自定义控件拖拽框dragbox
    基于openlayers实现聚类统计展示
    openlayers实现在线编辑
    openlayers之selectfeature
    J
    HDU-1051Wooden Sticks
    HDU-1087Super Jumping! Jumping! Jumping!
  • 原文地址:https://www.cnblogs.com/nihaorz/p/9012982.html
Copyright © 2011-2022 走看看