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
      });
   })
});

转载于:https://www.cnblogs.com/liushanping/p/4990203.html