본문 바로가기

프로그래밍

JavaScript - window.open() 옵션 및 속성

출처 : http://cocoaday.tistory.com 
 
window.open 옵션

window.open("URL입력","새창이름",'scrollbars=yes,toolbar=yes,location=yes,resizable=yes,status=yes,menubar=yes,resizable=yes,
width=100,height=100,left=0,top=0,fullscreen');

현재 위의 옵션은 풀 옵션은 아니지만 왠만해선 저 범위를 넘어서지 않을것이다.
속성 속성값 설명
scrollbars 0, no 안보여준다


 

1, yes 보임
toolbar 0, no 안보임


 

1, yes 보임
location 0, no 안보임


 

1, yes 보임
resizable 0, no 불가능

 

1, yes 가능
status 0, no 안보임

 

1, yes 보임
menubar 0, no 안보임

 

1, yes 보임
width 새창의 가로길이

 

 

height 새창의 세로길이
left 새창의 왼쪽 여백
top 새창의 윗부분 여백
fullscreen 1, yes 최대화 창으로 띄움
★ 일반 인터넷 창의 최대화 된 크기로 새창을 띄우고 싶을때
<html>
<head>
<script type="text/javavscript" language="javascript">
function new_window(){
userwidth = (screen.width - 10);
userheight = (screen.height - 200);
window.open("URL입력", "new_window1", 'scrollbars=yes,toolbar=yes,location=yes,status=yes,menubar=yes,resizable=yes,width=' + userwidth + ',height=' + userheight )
}
</script>
</head>
<body>
<input type="button" value="새창띄우기" onclick="javascript:new_window();">
</body>
</html>

하나하나 설명을 하자면 먼저, 자기만 볼 창이라면 굳이
userwidth = (screen.width - 숫자1);
userheight = (screen.height - 숫자2);
는 필요 없는 부분이다.
물론 이부분이 없어지면 '+userwidth+' '+userheight+' 이 부분도 숫자로 바껴야 한다는건 알것이다.

userwidth = (screen.width - 숫자1);
userheight = (screen.height - 숫자2);
이부분의 역활은 해당 컴퓨터의 해상도를 알아내서 일정 수치 만큼 빼준값을 변수 userwidth와 userheight 에 각각 담는것이다.
screen.width는 해당 컴퓨터의 해상도를 알아내는 screen객체의 width속성이라고 말할수 있다.

그렇다면 숫자1, 숫자2는 왜 빼는것인가?
그 이유는 screen.width가 화면 자체의 해상도만을 나타내기 때문이다.
즉 새창을 screen.width로 사용다면 화면보다 커져버리는 결과가 발생한다.
또한, screen.height도 마찬가지로 그대로 쓴다면 윈도우즈 작업 표시줄의 높이는 감안하지 않고
각 옵션(toolbar, location, menubar, status등)의 존재여부도 세로길이에 영향을 미치므로 일정의 수치만큼 빼야지 화면에 딱 맞는 새창이 나올것이다.

보통 숫자1은 10 정도면 가로 화면은 딱 맞다고 보면 되고
세로는 위에 열거한 옵션을 모두 yes로 했을시(fullscreen제외,top과 left는 0)에 200정도의 수치를 빼주면 최대화 화면에 근접한 화면을 볼수 있을것이다.