웹프로그래머

이전 포스트에서 잠깐 나온 쿠키플러그인

$.cookie('the_cookie');     // get cookie
$.cookie('the_cookie', 'the_value');     // set cookie
$.cookie('the_cookie', 'the_value', { expires: 7 });     // set cookie with an expiration date seven days in the future
$.cookie('the_cookie', '', { expires: -1 });      // delete cookie
$.cookie('the_cookie', null);     // delete cookie

플러그인 원본이 어디있는지 잊어버려서 링크를 못 걸겠다. ㅜ,.ㅜ

jquery.cookie.min.js

<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

간단하게 툴팁을 보여줄수 있다.

$("a").wTooltip();   // 모든 'a' 태그에 툴팁을 보여줌.

$("#block p").wTooltip({content: "Hello World"});

홈페이지 : http://wayfarerweb.com/wtooltip.php

jquery.wtooltip.js