DS's『 행복합시다 』

Carpe Programming/javascript

[javascript] window.open 옵션

nolite 2013. 2. 1. 13:51
반응형


window.open("파일명(경로포함)","새창이름",'scrollbars=yes,toolbar=yes,location=yes,
 
resizable=yes,status=yes,menubar=yes,resizable=yes,width=100,height=100,left=0,top=0,fullscreen');
 
 
 
현재 위의 옵션은 풀 옵션은 아니지만 왠만해선 저 범위를 넘어서지 않을것이다.

 
scrollbars : 다들 아시겠지만 우측부분과 하단 부분에 생기는 스크롤바를 지칭
 
toolbar : 뒤로, 앞으로, 검색, 즐겨찾기 등의 버튼 이 나오는 줄을 나타냄
 
location : URL입력하는 곳을 나타냄
 
resizable : 새창이 떴을 시에 최소화, 최대화 등을 비롯해 마우스로 창의 크기를 조절 가능 여부를 나타냄
 
status : 인터넷 창 아래부분 보면 회색깔의 링크 주소 나오는 부분
 
menubar : 파일, 편집, 보기 등의 버튼이 있는 줄
 
width : 새창의 가로길이
 
height : 새창의 세로길이
 
left : 새창의 왼쪽 여백(만약, left=100 이라고 했을시에 화면의 왼쪽 부터 100픽셀 떨어진 곳에서부터 새창이 생깁니다.)
 
top : 새창의 윗부분 여백
 
fullscreen : 새창을 띄울시 최대화 창으로 띄움

                 단, 일반적 인터넷 창의 최대화가 아닌 최소화 , 최대화, 닫기 버튼이 없는 특이한 형태의 창이 뜸,당연한 말이지만,

                 이 옵션을 쓰게 되면 width,height,top,left 옵션이 적용안됨.
 
 

★ 일반 인터넷 창의 최대화 된 크기로 새창을 띄우고 싶을때
 
일단 예제 소스 부터 보세요~
 
function new_window() {
    userwidth = (screen.width - 숫자1);
    userheight = (screen.height - 숫자2);
    window.open("./new.asp","new_window1",'scrollbars=yes,toolbar=yes,location=yes,status=yes,
 
    menubar=yes,resizable=yes,width='+userwidth+',height='+userheight+',left=0,top=0');
}


하나하나 설명을 하자면

먼저, 자기만 볼 창이라면 굳이 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정도의 수치를 빼주면 최대화 화면에 근접한 화면을 볼수 있을것이다.

 
 
[출처] -  http://blog.naver.com/kazena?Redirect=Log&logNo=130003205907

728x90
반응형