디스플레이 페이지로드에이 부트 스트랩 모달 나는 다음과 같은 부트 스트랩 모달이

Question

...

HTML :

<div id="tallModal" class="modal modal-wide fade"> 
    <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">Modal title</h4> 
     </div> 
     <div class="modal-body"> 
     <p>One fine body&hellip;</p> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Save changes</button> 
     </div> 
    </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div><!-- /.modal --> 

CSS :

.modal.modal-wide .modal-dialog { 
    width: 90%; 
} 
.modal-wide .modal-body { 
    overflow-y: auto; 
} 

JS :

$(".modal-wide").on("show.bs.modal", function() { 
    var height = $(window).height() - 200; 
    $(this).find(".modal-body").css("max-height", height); 
}); 

여기 CodePen에 있습니다 : https://codepen.io/TomAshley/pen/wPxBjB

페이지가로드되는 즉시 어떻게 모달을 표시 할 수 있습니까? 당신이 여기에서 볼 수 있듯이이 나의 시도는 window.load을 사용하고 있습니다 :

$(window).load("show.bs.modal", function() { 
     var height = $(window).height() - 200; 
     $(this).find(".modal-body").css("max-height", height); 
    }); 

을하지만 모달 팝업하지 않습니다. 페이지로드시이를 팝하는 방법은 무엇입니까?

Answer 1

트리거 모달은 프로그래밍 방식으로 여기에

$(document).ready(function() { 
    $('#tallModal').modal('show'); 
}); 

이 시나리오의 pen

Answer 2

내가 내 예를 들어 ID를 사용했는데 생각하지 않았다 우리가

$(document).ready(function() { 
    var height = $(window).height() - 200; 
    $(this).find(".modal-body").css("max-height", height); 
}