<div class="codetitle"> <span><a style="CURSOR: pointer" data="50007" class="copybut" id="copybut50007" onclick="doCopy('code50007')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다.</div> <div class="codebody" id="code50007"> <br><script type="text/javascript" src= "http: //img.zzl.com/script/jquery/jquery-1.4.2.min.js"></script> <br><script type="text/javascript"> $(function () { <br>$("#open").click(function() { <br>openDialog(a1); //호출, DIV의 ID를 직접 쓰면 됩니다 <br>}); <br>} ); <br>var openDialog = function(o) { <br>varDialog = new zzlDialog(o); <br>dialog.open() <br>} <br>var zzlDialog = function(o) ) { <br>this.init = function() { <br>/* 대화상자 초기화*/ <br>var XBox = ' <br><div id="mask"/> <br><div id =" wai"> <br><div id="nie"> <br><thead> ><td> <br>그림자 팝업<br> </td> <td> <br> 🎜 ><tbody> <br><tr> <br><td colspan="2">' $(o).html() ' <br></td> tr> <br></table> <br></div>' <BR>$(document.body) <BR>} ; <BR><BR>this.cssInit = function() { <BR>/* CSS 초기화*/ <BR>$("#wai").css({ "padding": "10px", "Background": " #000", "필터": "알파(불투명도='50')", "위치": "절대" }) <BR>$("#nie").css({ "위치": "절대 " , "z-index": "1000" }); <BR>$("#nie>table").css({ "border": "1px solid rgb(55,119,188)", "border-collapse": " 붕괴 ", "배경": "#fff" }); <br>$("#nie>table>thead>tr").css({ "배경": "rgb(0,94,172)", "color" : "#fff", "height": "30px", "font-size": "14px", "font-weight": "bold" }) <br>$("#nie>table").find ( "td").css({ "padding": "5"}); <br>/* 내부 본문 위치 지정*/ <br>$("#nie").css({ "top": "50px" } ); <br>$("#nie").css({ "left": "50px" }) <br>/* 닫기 버튼*/ <br>var $close = $("#nie>table> ; thead").find("td").next("td"); <br>$close.html("<span>닫기</span>"); <br>$close.css({ " text-align": "right", "padding-right": "5px" }); <br>$close.find("span").css({ "font-weight": "normal", "cursor" : "hand" }); <br>$close.find("span").click(function() { new zzlDialog().closes(); })/* 외부 그림자 추가, 위치 및 합 크기는 내부 콘텐츠에 의해 제어됩니다*/ <br>$("#wai").css({ "width": ($("#nie>table").width() 16) "px", "height ": ($("#nie>table").height() 16) "px" }); <br>$("#wai").css({ "top": $("#nie"). position( ).top - 8 "px", "왼쪽": $("#nie").position().left - 8 "px", "z-index": $("#nie").css( "z -index") }); <br>// $("#wai").corner("5px"); //둥근 모서리<br>} <br>this.open = function() { <br> this.init(); <br>this.cssInit(); <br>this.shadow() <br>}; <br>this.shadow() { <br>this.event_b_show() ; <br>if (window.attachEvent) { <br>window.attachEvent('onresize', this.event_b) <br>window.attachEvent('onscroll', this.event_b) <br>} else { <br>window.addEventListener('resize', this.event_b, false) <br>window.addEventListener('scroll', this.event_b, false) <br>} <br>}; <br>this.event_b = function() { <br>var oShadow = $('#mask') <br>if (oShadow.css("display") != "none") { <br>if ( this.event_b_show) { <br>this.event_b_show(); <br>} <br>} <br>} <br>this.closes = function() { <br>var oShadow = $('#mask' ); <br>oShadow.css({ 'display': 'none' }) <br>$("#wai").remove() <br>$("#nie").remove(); <br>}; <br>this.event_b_show = function() { <br>var oShadow = $('#mask') <br>oShadow.css({ 'position': 'absolute', 'display': '' , '불투명도': '0.1', '필터': '알파(불투명도=10)', '배경': '#000' }) <br>var sClientWidth = parent ? parent.document.body.offsetWidth : document .body.offsetWidth; <br>var sClientHeight = parent.document.body.offsetHeight : document.body.offsetHeight; <br>var sScrollTop = parent.document.documentElement .scrollTop ) : (document.body.scrollTop document.documentElement.scrollTop); <br>oShadow.css({ 'top': '0px', 'left': '0px', 'width': sClientWidth "px", '높이': (sClientHeight sScrollTop) "px" }) <br><br> </td> </div>