2014-01-30 3 views
0

높이를 브라우저 높이 해상도로 상쇄하는 모달 상자를 수정하는 방법에 대한 해결책을 누군가에게 알려 주거나 힌트를 줄 수 있습니까?modalbox 높이 오프셋 jqmodal의 브라우저 높이?

현재 모달 상자 높이가 500px x 1200px이고 브라우저가 1280x1024 인 경우 modalbox가 스크롤되지 않고 상자 아래 부분을 볼 수 없습니다. 나는 당신이 날 도울 수 있기를 바랍니다

, 당신에게

TIA

답변

0

감사합니다 나는 당신이 뷰포트 (예를 들어, 브라우저 창)의 비율로 모달 너비/높이를 설정하려는 같은데?

html/body의 너비와 높이를 100 %로 설정 한 CSS로이 작업을 수행 할 수 있습니다.

예를 들어, 뷰포트의 50 % 크기이고 중앙에 고정 된 모달은 다음과 같습니다.

<html> 
<head> 
<style type="text/css"> 
    html, body { margin: 0; padding: 0; } 
    html, body { height: 100%; width: 100%; } 

    #modal { 
    width: 50%; 
    height: 50%; 

    position: fixed; 
    top: 50%; 
    left: 50%; 

    margin-top: -25%; 
    margin-left: -25%; 

    /* display: none; */ 
    } 
</style> 
</head> 
<body> 
    <div id="modal"> 
     <h1>modal</h1> 
    </div> 
</body> 
</html>