jquery 修改 bootstrap模态框的宽度并且居中

1.定义模态框

    <div class="modal fade" id="Project_Cell_Modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="width:1400px;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title" id="myModal_Cel_Label">
                        请修改所选单元格的内容
                    </h4>
                </div>

                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-8" style="margin:0 80px;">
                            <div  class="input-group input-group-sm">

                                <span class="input-group-addon">修改内容</span>
                                <input id = "value_text1" type="text">
                            </div>
                            <div  class="input-group input-group-sm">
                                <span style="background: #f2dedf;display: none;" id = "cell_error" class="input-group-addon">填写内容不能为空</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                    </button>
                    <button type="button" id="submit_cell"  class="btn btn-primary">
                        修改
                    </button>
                </div>

            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

 

2.js设置居中

        $('#myModal').modal('show').css({
            width:'auto',
            'margin-left':function(){
            return-($(this).width()/2);
            }
         });