Develop
2013.11.18 18:32

[js] window.open() 속성 사용 방법

Views 13588 Votes 0 Comment 0
?

Shortcut

PrevPrev Article

NextNext Article

Larger Font Smaller Font Up Down Go comment Print
?

Shortcut

PrevPrev Article

NextNext Article

Larger Font Smaller Font Up Down Go comment Print
# Syntax
window.open(URL,name,specs,replace);


# name
- "_blank" : 새로운 창으로 로드 (Default)
- "_parent" : 부모 프레임으로 로드
- "_self" : 현재 창에서 로드
- "_top" : 가장 최 상위 프레임으로 로드
- name : The name of the window (Note: the name does not specify the title of the new window)

# specs
- width : 창 가로길이 지정 [no,yes(생김)] 
- height : 창 세로길이 지정 [no,yes(생김)] 
- toolbar : 단축도구창 유무지정 [no,yes(생김)] 
- menubar : 메뉴창 유무지정 [no,yes(생김)] 
- location : 주소창 유무지정 [no,yes(생김)] 
- scollbars : 스크롤바 지정 [no,yes(생김)] 
- status : 아래 상태바창 유무지정 [no,yes(생김)] 
- resizable : 창변형 유무지정 [no,yes(생김)] 
- fullscreen : 전체화면 유무지정 [no,yes(생김] 
- channelmode=yes : 앞&뒤로,창최소화.닫기등을 설정(F11번 키랑 같음) 
- left=0,top=0 : 창을 고정시킨다.왼쪽 구석에 고정 

# replace
- true : URL replaces the current document in the history list
- false : URL creates a new entry in the history list


# Javascript 코드 예제
<script type="text/javascript"> 
/* 
window.open(url:String, name:String, properties:String) 
open 
함수는 반드시 3개의 매개변수가 있고, 매개변수 순서는 지켜야 함. 
name은 팝업창의 이름, 주로 프레임 문서의 Target으로 사용 
name은 사용하지 않으려면 " " 만 표시해줍니다. 반드시 표시해야 함. 
*/ 

function win() {
    //속성 지정하지 않은 기본창
    window.open("https://www.hooni.net/", "", "");
}

function menu_win() {
    //메뉴바 없는 팝업
    window.open("https://www.hooni.net/", "", "menubar=1");
}

function full_win() {
    //풀스크린 방식
    window.open("https://www.hooni.net/", "", "fullscreen");
} 

function channel_win() {
    //채널모드
    window.open("https://www.hooni.net/", "", "channelmode");
}

function status_win() {
    //상태표시바 있는 팝업
    window.open("https://www.hooni.net/", "",
        "width=400, height=300, status=1");
} 

function popup_win1() {
    //크기 width400 height300 팝업창
    window.open("https://www.hooni.net/", "",
        "width=400, height=300"); 
} 

function popup_win2() {
    //위치 left=500, top=400 에서 열리는 팝업창
    window.open("https://www.hooni.net/", "",
        "width=400, height=300, left=500, top=400");
} 


function popup_win3() {
    //스크롤바 있는 팝업
    window.open("https://www.hooni.net/", "",
        "width=400, height=300, scrollbars=1");
} 


function popup_win4() {
    //주소표시줄 있는 팝업
    window.open("https://www.hooni.net/", "",
        "width=400, height=300, left=100, location=1");
} 
</script> 


# HTML 코드 예제
<body>

<input type="button" value="속성 지정하지 않은 기본 창" onclick="win()" />

<input type="button" value="메뉴바 없는 팝업" onclick="menu_win()" />

<input type="button" value="풀스크린 팝업" onclick="full_win()" />

<input type="button" value="채널모드 팝업" onclick="channel_win()" />

<input type="button" value="상태표시바 있는 팝업" onclick="status_win()" />

<input type="button" value="w:400, h:300 팝업" onclick="popup_win1()" />

<input type="button" value="left:500, top:400 팝업" onclick="popup_win2()" />

<input type="button" value="스크롤바 있는 팝업" onclick="popup_win3()" />

<input type="button" value="주소 입력 표시줄 있는 팝업" onclick="popup_win4()" />

</body>

[출처] http://www.w3schools.com/jsref/met_win_open.asp
?

List of Articles
No. Category Subject Author Date Views
57 Develop 리팩토링 계획안 file hooni 2017.05.15 746
56 Develop 사이버보안실무 발표자료 (2017.06.08) file hooni 2017.06.05 1201
55 Develop 캘리포니아 운전면허 족보 file hooni 2017.06.12 734
54 Develop [android] 간단한 SQLIite 예제 hooni 2017.06.14 1322
53 Develop [android] SQLiteOpenHelper를 이용한 DBManager hooni 2017.06.14 2060
52 Develop [coding] Find all anagrams in a string hooni 2017.06.27 1138
51 Develop [coding] 공부해야 하는거 ㅋㅋ secret hooni 2017.06.27 0
50 Develop [android] 안드로이드 앱 문서 샘플 - NCComix file hooni 2017.07.11 2103
49 Develop [ios] VIN Scanner (VIN barcode) 스캐너 file hooni 2017.09.16 644
48 Develop [php] mysql_ 과 mysqli_ 의 차이 hooni 2017.12.01 1691
47 Develop [php] Laravel 5.4: Specified key was too long error file hooni 2017.12.04 9221
46 Develop [js] URL 파싱하기 (jQuery 안쓰고) hooni 2017.12.14 1306
45 Develop [js] 문자열에서 숫자만 걸러내기 (jQuery 안쓰고 정규표현식) hooni 2017.12.14 1102
44 Develop [php][laravel] 초간단 MacOS에서 Laravel 개발 환경 구축 hooni 2017.12.15 1869
43 Develop [php][laravel] 라라벨 프로젝트 생성 및 구조 file hooni 2017.12.15 2378
42 Develop [php][laravel] 라라벨 개발환경 세팅하기 (Mac, Window) 2 file hooni 2017.12.15 2574
Board Pagination Prev 1 ... 48 49 50 51 52 53 Next
/ 53