46. (javascript/자바스크립트) 브라우저 사이즈, 해상도 구하기 및 window open 윈도우 창 열기 실시

/* =========================== */

[ 개발 환경 설정 ]

​

개발 툴 : Edit++

개발 언어 : javascript

/* =========================== */

​

/* =========================== */

[소스 코드]

<script> /* [요약 설명] 1. browserWidth : 브라우저 바디 영역 크기를 구합니다 2. screenWidth : 브라우저 해상도 값을 구합니다 3. window.open : 윈도우 창을 호출합니다 */ /* 이벤트 함수 정의 */ function main(){ console.log("[main] : [start]"); /* 버전별 예외 상황 회피 : 브라우저 가로, 세로 크기 구하기 */ var browserWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var browserHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; /* 브라우저 해상도 구하기 */ var screenWidth = screen.availWidth; var screenHeight = screen.availHeight; /* 결과 출력 실시 */ console.log("[main] : [browserWidth] : " + browserWidth); console.log("[main] : [browserHeight] : " + browserHeight); console.log("[main] : [screenWidth] : " + screenWidth); console.log("[main] : [screenHeight] : " + screenHeight); /* 윈도우 창 열기 실시 */ var windowUrl = "https://www.naver.com"; var windowName = "_blank"; // _blank : 새창 기본 / _parent : 부모에 포함됨 / _self : 현재 페이지 대체 / _top : 로드된 프레임셋 대체 var windowWidth = browserWidth / 2; var windowHeight = browserHeight / 2; var windowTop = 100; var windowLeft = 100; var windowFullScreen = "no"; // yes var windowUrlUse = "no"; //yes var windowMenuUse = "no"; //yes var windowScrollUse = "yes"; //no var windowStateUse = "no"; //yes var windowTittleUse = "no"; //yes var windowToolbarUse = "no"; //yes var windowResize = "yes"; //no var windowHistory = true; // true : 현재 히스토리를 대체 / false : 히스토리에 새 항목 var formatOption = ""; formatOption = formatOption + "width=" + windowWidth + ","; formatOption = formatOption + "height=" + windowHeight + ","; formatOption = formatOption + "toolbar=" + windowToolbarUse + ","; formatOption = formatOption + "scrollbars=" + windowScrollUse + ","; formatOption = formatOption + "resizable=" + windowResize + ","; formatOption = formatOption + "top=" + windowTop + ","; formatOption = formatOption + "left=" + windowLeft + ","; formatOption = formatOption + "replace=" + windowHistory + ","; formatOption = formatOption + "channelmode=" + windowFullScreen + ","; formatOption = formatOption + "status=" + windowStateUse + ","; formatOption = formatOption + "location=" + windowUrlUse + ","; formatOption = formatOption + "menubar=" + windowMenuUse + ","; formatOption = formatOption + "titlebar=" + windowTittleUse + ","; formatOption = formatOption + "toolbar=" + windowToolbarUse; console.log("[main] : [windowUrl] : " + windowUrl); console.log("[main] : [windowName] : " + windowName); console.log("[main] : [windowOption] : " + formatOption); window.open(windowUrl, windowName, formatOption); //윈도우 창 오픈 실시 }; </script>

/* =========================== */

​

/* =========================== */

[결과 출력]

​

​

/* =========================== */

​

/* =========================== */

[요약 설명]

​

/*

[요약 설명]

1. browserWidth : 브라우저 바디 영역 크기를 구합니다

2. screenWidth : 브라우저 해상도 값을 구합니다

3. window.open : 윈도우 창을 호출합니다

*/

/* =========================== */