bootstrap-彈框問題-居中

fcp740079600發表於2017-11-17
data-toggle="modal" data-target="#addproject"
<!--修改專案--> <div class="modal fade" id="addproject" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <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 login-byCardTitle" >修改專案</h4> </div> <div class="modal-body"> <p style="font-size: 15px">專案名稱: </p> <p><input style="width: 80%;height: 35px" class="d-name"></p> <p style="font-size: 15px">版本號: </p> <p><input style="width: 80%;height: 35px"class="d-history"></p> <p style="font-size: 15px">專案型別:<select class="myselect" name="account" value="" style="width: 150px;height: 35px"> <option value="0">pc端</option> <option value="1">手機端</option> <option value="2">小程式</option> </select></p> <p style="font-size: 15px">專案說明:</p> <p> <textarea placeholder="輸入詳細說明" style="min-height: 100px;width: 90%" class="d-text"></textarea> </p> </div> <div class="modal-footer"> <button type="button" class="btn btn-primary public-fontBlack" data-dismiss="modal">確認</button> <button type="button" class="btn btn-danger public-fontBlack" data-dismiss="modal">返回</button> </div> </div> </div></div>
<!--
居中方法
-->
function initPublicView(){
    $(".modal").on("shown.bs.modal",function(e){
        console.log($(e.target).find(".modal-dialog").height());
        $(e.target).find(".modal-dialog").css("margin-top",($(document).height()-$(e.target).find(".modal-dialog").height())/2);
    })
}

相關文章