[jQuery] window.open() 팝업 완벽개념정리

window.open() 개념 완벽정리, 윈도우 팝업 설정하는 방법

프로그래밍 개발을 하다보면 팝업을 띄우는 일은 많습니다.

팝업을 띄우면서 옵션도 설정을 할 수 있는데요.

오늘은 window.open() 팝업에 대한 모든 개념을 정리해보도록 하겠습니다.

 

window.open() 개념

var popup = window.open(url, name, option);

var popup = window.open('팝업주소', '팝업창 이름', '팝업창 설정');

 

팝업 클릭시 네이버창 팝업 띄우기

<script type="text/javascript">
function openPop(){
    var popup = window.open('http://www.naver.com', '네이버팝업', 'width=700px,height=800px,scrollbars=yes');
}
</script>
<body>
   <a href="#none" target="_blank" onclick="openPop()">팝업</a>
</body>

 

팝업을 여는 위치 설정

팝업을 띄울때 위치를 설정 할 수 있습니다.

- target="_blank" : 팝업을 새창에서 엽니다. target을 입력하지 않으면 default 값입니다.

- target="_parent" : 부모창에서 팝업이 열립니다.

- target="_self" : 현재 페이지에서 팝업이 열립니다.

- target="_top" : 현재 페이지에서의 최상의 페이지에서 팝업이 열립니다.

<!--팝업을 여는곳 -->
 <a href="#none" target="_blank" onclick="openPop()">팝업</a>

 

팝업 상세설정

사용여부 ( yes 또는 no )

fullscreen : 팝업 전체화면 출력 여부 ( IE에서만 작동 )

toolbar : 상단 도구창 출력 여부 ( IE, FireFox 에서만 작동 )

location : 메뉴 아이콘 출력여부 ( Opera 에서만 작동 )

resizeable : 팝업창 리사이즈 가능여부 ( 크롬에서는 작동 안함)

scrollbars : 팝업 스크롤바 사용 여부

menubar : 메뉴 출력 여부

 

사이즈 정의( 픽셀 px )

width : 팝업창의 가로 길이

height : 팝업창의 세로 길이

top : 창의 화면 위에서부터의 팝업 위치 지정

left : 창의 화면 왼쪽에서부터의 팝업 위치 지정

 

예) 가로 500px, 세로 700px, 스크롤바 가능, 사이즈변경X

->  window.open('http://www.naver.com', '네이버팝업', 'width=500, height=700, scrollbars=yes, resizable=no')

 

 

 

 

 

 

 

 

 

 

 

댓글

Designed by JB FACTORY