bootstrap的模态框问题

本人在写一个网站程序的时候，之前学了bootstrap，就在这个项目中用到了bootstrap，很好用，开发的速度大大提高，不过有遇到几个问题，记下来：

想实现通过模态框弹出登录、注册操作页面

根据bootstrap的文档，可以通过设置url来获取数据源来渲染页面。

因为多个页面需要用到这个，我就进行尝试，结果出现了点击一次，背景的蒙版就越来越黑，直到看不见父页面（此问题没有得到解决）...

image.png

弹出框还有一个问题，就是不是垂直居中，很不好看，于是找解决方案。

发现通过修改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 : ''
    })
    // 是弹出框居中。。。
    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'});
  }