인터넷정보

웹페이지 대화상자 (부모창 위에 새창이 항상 최상위에 존재)

알 수 없는 사용자 2007. 10. 18. 13:43
웹페이지 대화상자로 부모창의 최상위에 새창이 항상 존재한다.
익스플로러 전용이구여 익스플로러 4.0 이상에서만 지원합니다.

showModalDialog와 showModelessDialog 두가지를 사용합니다.

showModalDialog
창이 떠있는한 부모창을 선택할수없다. 항상 최상위에 존재한다.

showModelessDialog
창이 떠있어도 부모창을 선택 가능하고 한 부모창에 여러개의 showModelessDialog창이 존재할수있다.
부모창을 클릭하더라도 선택은 되지만 항상 최상위에 존재한다.


로딩시 자동으로 새창 띄우기
<script language="JavaScript">
// showModalDialog 사용시
window.showModalDialog("경로","이름","옵션");
// showModelessDialog 사용시
// window.showModelessDialog("경로","이름","옵션");
</script>

마우스 클릭으로 새창 띄우기
<a onclick="JavaScript:window.showModalDialog('경로','이름','옵션');">새창테스트</a>
<a onclick="JavaScript:window.showModelessDialog('경로','이름','옵션');">새창테스트</a>

옵션을 미리 선언하고 띄우기
<SCRIPT>
function OpenDialog(){
        var Features="dialogHeight: 500px; dialogWidth: 600px; center: yes; help: no; resizable: yes; status: yes;";
        window.showModalDialog("http://oxtag.com",  "NewDialog", Features);
        // window.showModelessDialog("http://oxtag.com",  "NewDialog", Features);
}
</SCRIPT>
<a href="#None" onClick="OpenDialog()">showModalDialog Method</a>


옵션 예제
"dialogWidth:202px;dialogHeight:168px;dialogLeft:200px;dialogTop:200px;status:no;help:no;scroll:no;"


옵션 설명

세로 길이
dialogHeight:sHeight Sets the height of the dialog window (see Remarks for default unit of measure).

가로 길이
dialogWidth:sWidth Sets the width of the dialog window (see Remarks for default unit of measure).

창의 왼쪽에서 떨어지는 위치
dialogLeft:sXPos Sets the left position of the dialog window relative to the upper-left corner of the desktop.

창의 상단에서 떨어지는 위치
dialogTop:sYPos Sets the top position of the dialog window relative to the upper-left corner of the desktop.

창의 중앙 위치 여부 - 기본값 Yes
center:{ yes | no | 1 | 0 | on | off } Specifies whether to center the dialog window within the desktop. The default is yes.

인쇄나 미리보기시 표시 여부 - 기본값 No
dialogHide:{ yes | no | 1 | 0 | on | off } Specifies whether the dialog window is hidden when printing or using print preview. This feature is only available when a dialog box is opened from a trusted application. The default is no.

안쪽 공간 여부 (sunken=있음, raised=없음) - 기본 값 raised
edge:{ sunken | raised } Specifies the edge style of the dialog window. The default is raised.

도움말표시 여부 - 기본 값 Yes
help:{ yes | no | 1 | 0 | on | off } Specifies whether the dialog window displays the context-sensitive Help icon. The default is yes.

창 넓이 조정 여부 - 기본 값 No
resizable:{ yes | no | 1 | 0 | on | off } Specifies whether the dialog window has fixed dimensions. The default is no.

스크롤바 여부 - 기본 값 Yes
scroll:{ yes | no | 1 | 0 | on | off } Specifies whether the dialog window displays scrollbars. The default is yes.

상태표시줄 여부 - 기본 값 Yes
status:{ yes | no | 1 | 0 | on | off } Specifies whether the dialog window displays a status bar. The default is yes for untrusted dialog windows and no for trusted dialog windows.

창틀 여부 - 기본 값 No (웹브라우져에선 적용안됨.)
unadorned:{ yes | no | 1 | 0 | on | off } Specifies whether the dialog window displays the border window chrome. This feature is only available when a dialog box is opened from a trusted application. The default is no.
반응형