Notice
Recent Posts
Recent Comments
Link
«   2025/06   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30
Tags more
Archives
Today
Total
관리 메뉴

nkdk의 세상

JS :: 팝업창 출력 본문

My Programing/HTML and JavaScript

JS :: 팝업창 출력

nkdk 2008. 6. 16. 10:09

  • open()
    window객체에 포함된 메서드로 새로운 창을 열기위해 사용됩니다.

|형식| open(해당URL, 이름, 속성)
|예제| open("http://www.naver.com","pop1","width=300 height=200")

    • directories : 연결바의 유무를 설정합니다. "yes"와 "no"로 설정합니다.
    • location : 주소창의 유무를 설정합니다.
    • menubar : 메뉴바의 유무를 설정합니다.
    • scrollbars : 스크롤바의 유무를 설정합니다.
    • status : 상태바의 유무를 설정합니다.
    • toolbar : 툴바의 유무를 설정합니다.
    • resizable : 브라우저 크기조절의 가능유무를 설정합니다.
    • top : 창의 x좌표를 설정합니다.
    • left : 창의 y좌표를 설정합니다.
    • width : 창의 너비를 설정합니다.
    • height : 창의 높이를 설정합니다.
    • fullscreen : 창을 브라우저 전체에 나타나게 할 것인지를 설정합니다.
    • channelmode : 창을 채널모드로 보여줍니다.
  • close()
    window객체에 포함된 메서드로 창을 닫을 때 사용됩니다.

<html>
<body>
<script language="javascript">
<!--

function open_win(url) {
window.open(url,"open_naver","top=100 left=100 width=640 height=400")
}

function auto_win() {
window.open("pop.htm","new_win","top=70 left=70 width=200 height=100")
}

// -->
</script>

<body onload="javascript:auto_win()">
<a href="javascript:open_win('http://www.naver.com')">
클릭하면 네이버 팝업창이 나타납니다.
</a>
</body>
</html>

<!-- pop.htm _문서열람시 자동으로 뜨는 팝업창입니다. -->

<html>
<body>
<center>

팝업창입니다.<p>
<button onclick="self.close()">닫습니다.</button>

</center>
</body>
</html>

self속성은 현재 창의 객체를 가리킬 때 사용됩니다.
간단하게 팝업창을 띄우고자 한다면 다음의 예제를 활용합니다.

<a href="#" onclick="javascript:window.open('팝업창 URL', '팝업창 이름', '팝업창 속성')"> 링크텍스트 </a>
'My Programing/HTML and JavaScript' Related Articles more