window.open으로 간단하게 만들 수 있는 윈도우 팝업
막상 할려고 하면 자꾸 헷갈려서 복습 겸 작성 시작! 🛵
1. window.open()
window.open()
메소드는 새창으로 팝업을 만들때 사용됩니다.
📌 기본 구조
window.open('url','name','option')
🔸 url
새창(팝업창)에 보여질 주소
비워두면 빈창(about:blank)이 보이게 된다.
🔸 name
새로 열릴 창의 속성 또는 창의 이름을 지정한다.
- _blank : 새 창으로 연다. (기본값)
- _parent : 부모 프레임에 열린다.
- _self : 현재 페이지에서 팝업이 열린다.
- _top : 현재 페이지에서의 최상의 페이지에서 팝업이 열린다.
🔸 option
팝업창의 설정으로 다음 속성들을 지정해 넣으면 된다.
❗값은 yes 또는 no로 지정❗
- toolbar : 상단 도구창 출력 여부 ( IE, FireFox 에서만 작동 )
- menubar : 상단 메뉴 출력 여부
- location : 메뉴 아이콘 출력 여부 ( Opera 에서만 작동 )
- directories : 제목 표시줄 출력 여부
- status : 하단의 상태바 출력 여부
- scrollbars : 스크롤바 사용 여부
- resizeable : 팝업창의 사이즈 변경 가능 여부 ( 크롬에서는 작동 안함 )
- fullscreen : 팝업 전체화면 출력 여부( IE에서만 작동 )
❗사이즈 정의❗
- width : 팝업창의 가로 길이
- height : 팝업창의 세로 길이
- top : 화면 위에서부터의 팝업 위치 지정
- left : 화면 왼쪽에서부터의 팝업 위치 지정
🔑 사용 방법
window.open()
은 두가지 방법으로 사용할 수 있습니다.
onclick
속성으로 사용
function
함수를 호출하여 사용
1. onclick 사용
2. function 사용
간단한 방법으로 윈도우 팝업을 만들어 봤습니다~~ 😎
이제는 까먹지않아~~