- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <!-- 현재 작성하고 있는 파일은 UTF-8 DOS파일입니다.-->
- <html xmlns="http://www.w3.org/1999/xhtml" lang="ko">
- <head>
- <meta http-equiv="content-type" content="text/html; charset=utf-8" />
- </head>
- <body>
- <div id="ex_js_syntax">
- <script type="text/javascript" language="javascript">
- <!--
- function window_open(){
- /* 윈도우 새창 열기(http://www.daum.net) => window.open("url주소");
- window.open(URL,name,specs,replace)
- ※ name
- _blank, _parent, _self, _top, name(원도우 이름) || 기본적으로 _blank(새창)
- ※ specs
- width=pixels => 넓이
- height=pixels => 높이
- top=pixels => 창 맨 위에서 위치
- left=pixels => 창 왼쪽에서 위치
- menubar=yes|no|1|0 => 메뉴 표시 줄 여부
- status=yes|no|1|0 => 상태 표시 줄 추가 여부
- titlebar=yes|no|1|0 => 제목 표시 줄 여부
- 나머지 기능은 브라우저 별로 지원이 다름
- scrollbars=yes|no|1|0 => 스크롤바 막대 표시 여부[MSIE & Firefox & Opera만 지원]
- toolbar=yes|no|1|0 => 브라우저 도구모음 표시 여부[MSIE & Firefox 만 지원]
- channelmode=yes|no|1|0 => 극장모드로 창 열기[MSIE만 지원]
- fullscreen=yes|no|1|0 => 전체화면모드로 창 열기 [MSIE만 지원]
- resizable=yes|no|1|0 => 창 크기 조정 여부[MSIE만 지원]
- location=yes|no|1|0 => 주소 필드 표시 여부[Opera만 지원]
- ※ replace
- true - URL 히스토리 목록에 현재 문서 저장 안함
- false - URL 히스토리 목록에 현재 문서 저장
- */
- open_url = "http://www.daum.net";
- open_specs = "width=500, height=400, top=50, left=50, location=yes, menubar=yes, status=yes, titlebar=yes";
- open_specs_browsers = navigator.userAgent;
- /* 브라우저 판별식 */
- out_side_browser = 0;
- /* 브라우저 맞게 specs 추가 */
- if(open_specs_browsers.search("MSIE")!= -1){
- /* Internet Explorer 브라우저 참조로 극장모드 no하면 fullscreen모드임*/
- open_specs += ", scrollbars=yes, toolbar=yes, channelmode=yes, fullscreen=yes, resizable=yes";
- }
- else if(open_specs_browsers.search("Firefox")!= -1){
- /* Firefox 브라우저 */
- open_specs += ", scrollbars=yes, toolbar=yes";
- }
- else if(open_specs_browsers.search("Opera")!= -1){
- /* Opera 브라우저 */
- open_specs += ", scrollbars=yes, location=yes";
- }
- else if(open_specs_browsers.search("Chrome")!= -1){
- /* Chrome 브라우저 */
- /* MSIE의 fullscreen기능을 다른 브라우저에 비슷하게 지원은 아래처럼 하면 될듯... */
- open_specs_fullscreen = "height=" + screen.availHeight + ", width=" + screen.availWidth
- open_specs = open_specs_fullscreen + ", location=yes, menubar=yes, status=yes, titlebar=yes";
- }
- else if(open_specs_browsers.search("Safari")!= -1){
- /* Safari 브라우저 */
- }
- else{
- /* 5대 부라우저(MSIE Firefox Opera Chrome Safari) 외 판별식으로 기본속성만 사용전환 */
- out_side_browser = 1;
- }
- if(out_side_browser != 1) open_window = window.open(open_url,"_blank", open_specs, false);
- else open_window = window.open(open_url);
- document.getElementById("window_open").innerHTML = open_url+" 창열기";
- }
- function window_open_close(){
- /* 윈도우 창 열기(http://www.daum.net) => window.open(); */
- open_close_url = "http://www.daum.net";
- open_close_specs = "width=350, height=200, top=300, left=300";
- open_close_window = window.open(open_close_url, "open_close_window", open_close_specs, false);
- document.getElementById("window_open_close").innerHTML = open_close_url+" 창열기";
- }
- function window_close(){
- /* 윈도우 창 닫기(http://www.daum.net) => window.close(); */
- open_close_window.close();
- document.getElementById("window_close").innerHTML = open_close_url+" 창닫기";
- }
- //-->
- </script>
- <form name="input_type" id="input_type" method="post" >
- <!-- 예제 박스에선 안됨 => form태그안에 form태그있으면 지워짐~ㅠ.ㅠ -->
- 윈도우 => 창 열기(http://www.daum.net) <br />
- <p id="window_open" onclick="window_open();">window객체-메서드 open()[클릭]</p>
- <hr />
- 윈도우 => 창 닫기(http://www.daum.net) <br />
- <p id="window_open_close" onclick="window_open_close();">window객체-메서드 close()사용할 open()[클릭]</p>
- <p id="window_close" onclick="window_close();">window객체-메서드 close()[클릭]</p>
- </form>
- </div>
- </body>
- </html>
--------------------------------------------------------------------------------------------
위 소스 예제 보기
윈도우 창 열기(http://www.daum.net) => window.open();
윈도우 창 닫기(http://www.daum.net) => window.close();
window.open(URL,name,specs,replace) 속성 설명
※ name
_blank, _parent, _self, _top, name(원도우 이름) || 기본적으로 _blank(새창)
※ specs
문법 |
설명 |
width=pixels |
창 넓이 |
height=pixels |
창 높이 |
top=pixels |
창 맨 위에서 위치(y좌표) |
left=pixels |
창 왼쪽에서 위치(x좌표) |
menubar=yes|no|1|0 |
창 메뉴 표시 줄 여부 |
status=yes|no|1|0 |
창 상태 표시 줄 추가 여부 |
titlebar=yes|no|1|0 |
창 제목 표시 줄 여부 |
아래 리스트 부터는 브라우저 별로 지원이 다름 |
|
scrollbars=yes|no|1|0 |
창 스크롤바 막대 표시 여부[MSIE & Firefox & Opera만 지원] |
toolbar=yes|no|1|0 | 창 브라우저 도구모음 표시 여부[MSIE & Firefox 만 지원] |
channelmode=yes|no|1|0 | 창 극장모드로 창 열기[MSIE만 지원] |
fullscreen=yes|no|1|0 | 창 전체화면모드로 창 열기 [MSIE만 지원] |
resizable=yes|no|1|0 | 창 크기 조정 여부[MSIE만 지원] |
location=yes|no|1|0 | 창 주소 필드 표시 여부[Opera만 지원] |
※ replace
true - URL 히스토리 목록에 현재 문서 저장 안함
false - URL 히스토리 목록에 현재 문서 저장
window 속성 보기(접어두었습니다.)
출처 & 인용 - http://www.w3schools.com/
'javascript > window()객체' 카테고리의 다른 글
window객체 resizeBy() resizeTo() 창크기[상대적, 절대적] (0) | 2014.02.08 |
---|---|
window객체 moveBy() moveTo() 창 이동[상대적, 절대적] (0) | 2014.02.08 |
window객체 print() 프린트 (0) | 2014.02.08 |
window객체 prompt() 질문창 (0) | 2014.02.07 |
window객체 confirm() 확인창 (0) | 2014.02.07 |