본문 바로가기

팝업 화면 중앙 배치

 

팝업 띄울 때, 모니터 중앙에 오도록 배치하기.
* 듀얼 모니터 사용시에도 해당 모니터 중앙에 오도록 배치

 

# vi popup.html

<html>
<head>
<script type="text/javascript">
function move_popup() {

    // window.innerWidth(Height) 를 사용하여 팝업 사이즈를 지정할 수도 있지만
    // 크롬에서 위 코드가 정상 작동하지 않을 시 직접 입력.
    var w = 800;
    var h = 600;

    // 팝업을 중앙으로 옮기기 위한 좌표 구하기
    var res_w = ( screen.availWidth - w ) / 2;
    var res_h = ( screen.availHeight - h ) / 2;

    // 팝업을 일단 모니터 좌측에 붙임.
    window.moveTo( 0, res_h );

    // 듀얼 모니터 사용시 팝업의 window.screenLeft 반환값은, 
    // 좌측 모니터에서는 0, 우측 모니터에서 좌측 모니터 가로길이가 계산되므로
    // 우측 모니터에서는 좌측 모니터 가로길이를 추가 계산.
   
 if ( window.screenLeft > window.screen.width ) {
        res_w = window.screen.width + res_w;
    }

    // 팝업을 중앙으로 재배치
    window.moveTo( res_w, res_h );
}
</script>

</head>
<body onload="move_popup()"><!-- call function -->