본문 바로가기

웹/HTML / Javascript

내용에 맞게 팝업창 크기 조절

보통 팝업창 사이즈를 정할 때

 

window.open() 안에다가 width, height 속성을 줘서 크기를 정한다. 근데, 팝업 페이지 크기가

 

제각각일 경우 일일히 수동으로 정해주면 매우 비효율적이게 된다. 이러고 싶지 않을 때(?) 사용한다.

 

일단 평소와 다름없는 팝업 호출 함수를 하나 만든다.

 

 

 

function openWindow(url, name)    {

var win;

win = window.open(url, name, 'scrollbars=no,width=10,height=10,status=no,resizable=no');

win.opener.self;

}

 

일단 여기서는 width와 height에 아무 값이나 넣어도 상관 없다...

 

그 뒤, 각각의 팝업 페이지에 이 함수를 집어넣는다. (사이즈를 재조정 해주는 함수다.)

 

function resizeWindow(win)    {

var wid = win.document.body.offsetWidth + 30;

var hei = win.document.body.offsetHeight + 40;        //30 과 40은 넉넉하게 하려는 임의의 값임

win.resizeTo(wid,hei);

}

 

 

이걸 넣어주고, 팝업페이지의 body가 onload 될 때 이 함수를 실행시켜주고, 자신을 인자로 넘기면 된다.

 

<body onload='resizeWindow(this)'>