본문 바로가기

DHTML/Javascript

자바스크립트 팝업창 속성

<img src="이미지경로" onclick=open("경로")>

------------------------------------------------------------------------



Window창의 속성

------------------------------------------------------------------------
menubar       yes/no      메뉴바를 보여주거나 숨김
toolbar         yes/no      도구막대를 보여주거나 숨김

directories    yes/no      디렉토리바를 보여주거나 숨김

scrollbars     yes/no      스크롤바를 보여주거나 숨김

status          yes/no      상태표시줄을 보여주거나 숨김

location        yes/no      주소표시줄을 보여주거나 숨김
width           픽셀          윈도우의 가로크기를 지정
height          픽셀          윈도우의 높이를 지정
left              픽셀          윈도우의 x축 위치를 지정
top              픽셀          윈도우의 y축 위치를 지정
resizable      yes/no      팝업윈도우의 크기를 사용자가 임의로 수정할 수 있는지 여부를 지정
fullscreen     yes/no      전체화면 모드로 새창 열림

------------------------------------------------------------------------


Window창의 활용  스크립트

------------------------------------------------------------------------
<script language="javascript">
function winOpen()
{
 window.open("http://cafe.naver.com/homepagemaeul","new","width=500,height=500,top=100,left=100");
}
</script>
 
<a href="javascript:;" onclick="winOpen()">500x500사이즈의 새창열기(100x100위치에)</a>

 

위의 예재를 보시면 알갯지만 새창을 뛰우는 작업은 매우 간단한 작업입니다.^^ 위의 예재을 약간변형하여

여러개의 이미지에 쓰기위해서 function 를 여러개 만드는 건 비효율적이므로 아래와 같이 만들수 있습니다.

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
 <script>

//윈도우 오픈시 필요한 주소,재목,넓이,높이,표시위치,표시위치
 function winOpen(url,title,width,height,top,left){
  window.open(url,title,"width="+width+",height="+height+",top="+top+",left="+left);
 }
 </script>
 </HEAD>

 <BODY>
  <IMG SRC="C:/Documents and Settings/Administrator/My Documents/My Pictures/bg.jpg" WIDTH="340" HEIGHT="255" BORDER="0" ALT="클릭하면새창이떠요^^" style="cursor:hand"onclick="winOpen('http://blog.naver.com/ckwjddlf','new','width=500,height=500,top=100,left=100'); ">
 </BODY>
</HTML>