팝업창 생성

<style type="text/css">
/* Popup Style */
.dragDiv { position:absolute; z-index:1000; background-color:#EFF7FF; border:1px solid #96C2F1; }
.dragDiv h5 { background-color:#B2D3F5; padding:5px; height:16px; margin:1px; font-size:12px; }
.dragDiv .pop_content { position:relative; }
.dragDiv .pop_btn { margin:3px 5px 3px 3px; text-align:right; height:20px; vertical-align:middle; text-align:middle; }
.dragDiv .pop_sub { width:100%; height:100%; }
.dragDiv .pop_sub_title { text-align:center; margin:5px; padding:0; font-size:14px; }
.dragDiv .pop_sub_content { margin:0 5px; padding:0; }
</style>

<script type="text/javascript">
     $(function() {
          $('.dragDiv').Drags({
               handler: '.handler',
               zIndex:1000,
               opacity:.9
          });
     });
     function popHide( arg ) {
          $("div[id='"+ arg +"']").fadeOut("fast");
     }
     function popFired( arg, day ) {
          $.cookie( arg, 'closed', { expires: day });
          popHide( arg );
     }
</script>

<div id="dragDiv" class="dragDiv">
     <h5 class="handler">팝업 타이틀<a href="#" onclick="popHide('dragDiv');return false;" class="fr">닫기</a></h5>
     <div class="pop_content">팝업 내용</div>
     <div class="pop_btn">
          <label><input type="checkbox" name="" value="" onclick="popFired('dragDiv','1');" />하루동안 창닫기</label>
     </div>
</div>

드래그가 가능한 팝업창. 쿠키를 지원한다.

쿠키와 드래그 스크립트 파일을 로드해야 가능.

jquery.drag.js

jquery.cookie.min.js