Popup layer 구현

    1. 데모

    2. 소스


    <SCRIPT language=JavaScript>

    function closePopupLayer(name){
     if(document.all[name].style.display==""){
      document.all[name].style.display="none"
     }
    }

    function closePeroidPopupLayer(name, key, period){
     setCookie( key, "checked" , period);
     closePopupLayer(name);
    }

    function checkToViewLayerPopup(name, key) {
     if ( getCookie(key) == "checked" ) {
      closePopupLayer(name);
     }
    }

    isIE=document.all;
    isNN=!document.all&&document.getElementById;
    isN4=document.layers;
    isHot=false;

    function ddInit(e){
      topDog=isIE ? "BODY" : "HTML";
      whichDog=isIE ? document.all.PopupLayer : document.getElementById("PopupLayer");
      hotDog=isIE ? event.srcElement : e.target;
      while (hotDog.id!="PopupLayer"&&hotDog.tagName!=topDog){
        hotDog=isIE ? hotDog.parentElement : hotDog.parentNode;
      }
      if (hotDog.id=="PopupLayer"){
        offsetx=isIE ? event.clientX : e.clientX;
        offsety=isIE ? event.clientY : e.clientY;
        nowX=parseInt(whichDog.style.left);
        nowY=parseInt(whichDog.style.top);
        ddEnabled=true;
        document.onmousemove=dd;
      }
    }

    function dd(e){
      if (!ddEnabled) return;
      whichDog.style.left=isIE ? nowX+event.clientX-offsetx : nowX+e.clientX-offsetx;
      whichDog.style.top=isIE ? nowY+event.clientY-offsety : nowY+e.clientY-offsety;
      return false;
    }

    document.onmousedown=ddInit;
    document.onmouseup=Function("ddEnabled=false");

    </SCRIPT>

    <DIV id=PopupLayer
    style="Z-INDEX: 10000; LEFT: 250px; WIDTH: 330px; POSITION: absolute; TOP: 110px; HEIGHT: 200px; visible: ">
    <TABLE height="100%" cellSpacing=3 cellPadding=0 width="100%" bgColor=#dbdbdb
    border=0>
    <TBODY>
    <TR>
    <TD
    style="PADDING-RIGHT: 1px; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; PADDING-TOP: 1px"
    vAlign=top bgColor=#ffffff>
    <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
    <TBODY>
    <TR>
    <TD bgColor=#0079bd height=45>&nbsp;&nbsp; <SPAN style="FONT-WEIGHT: bold"><FONT
    style="FONT-SIZE: 15px; COLOR: #ffffff; font-face: 돋움">사이트 리뉴얼 기념 고객 사은
    이벤트</FONT></SPAN></TD></TR></TBODY></TABLE>
    <TABLE cellSpacing=30 cellPadding=0 width="100%" border=0>
    <TBODY>
    <TR>
    <TD>사이트 리뉴얼 기념으로 고객 사은 이벤트를 실시합니다. 이벤트 기간 동안 신규 유료서비스 고객께 1개월 기간연장 혜택을 드리고
    있습니다.<BR>Power Analysis WSOS를 좋은 조건으로 이용해 보실 수 있는 최적의 기회 입니다.
    <P>
    <TABLE cellSpacing=0 cellPadding=0 border=0>
    <TBODY>
    <TR>
    <TD></TD>
    <TD height=5></TD></TR>
    <TR>
    <TD><IMG height=10 src="/images/popup/popup_link.gif" width=14
    align=absMiddle></TD>
    <TD><A href="http://www.wsos.co.kr"><STRONG><U><FONT
    color=#ff7800>자세히보기</FONT></U></STRONG></A></TD></TR></TBODY></TABLE></P></TD></TR></TBODY></TABLE>
    <TABLE height=26 cellSpacing=0 cellPadding=0 width="100%" bgColor=#d3e3dd
    border=0>
    <TBODY>
    <TR height=26>
    <FORM id=form name=form>
    <TD width=15></TD>
    <TD><INPUT onclick="closePeroidPopupLayer('PopupLayer', 'openEvent', 24*60);"
    type=checkbox value=checkbox name=notOpenToday> 하루동안 이 창 열지않음</TD>
    <TD align=right><A href='javascript:closePopupLayer("PopupLayer");'><IMG
    src="/images/popup/popup_btn_070202.gif" border=0></A></TD>
    <TD width=15></TD></FORM></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV>
    <SCRIPT language=JavaScript>
    checkToViewLayerPopup("PopupLayer","openEvent");
    </SCRIPT>

    Posted by 부니기