[jquery] 은행들 처럼 상단에서 내려오는 팝업 > script

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="./jquery.cookie.js"></script>

<script type="text/javascript">
<!--
 $(document).ready(function() {
  layer_open('layer1');
 });

 function layer_open(el) {
  var tmp = $.cookie('popup_'+el);
  if(tmp!="off"){
   $.cookie('popup_'+el, 'on', { path: '/main/', expires: 1 });
  }

  $("p.pop_close").css({ "cursor":"pointer" });
  $("p.today01").css({ "cursor":"pointer" });

  var temp = $('#' + el);
  var bg = temp.prev().hasClass('bg');

  if (bg) {
   $("div.layer:not(:animated)").slideToggle("slow");
  } else {
   temp.css("display","none");
   temp.slideDown("slow");
  }
  temp.find('.pop_close img').click(function(e) {
   if (bg) {
   $("div.layer:not(:animated)").slideToggle("slow");
   } else {
     temp.slideToggle("slow");
   }
   e.preventDefault();
  });

  $('.layer .bg').click(function(e) {
   $("div.layer:not(:animated)").slideToggle("slow");
   e.preventDefault();
  });

  $('.today01 input:checkbox').click(function(e) {
   var thisid2 = $(this).attr('id');
   thisid3 = thisid2.substring(6,12);
   $('#'+thisid3).slideToggle("slow");
   e.preventDefault();
   $.cookie(thisid2, 'off', { path: '/main/', expires: 1 });
  });
 }
</script>

<div id="layer1" class="pop-layer1">
 <div id="pop_bg">
  <div id="pop_wrap">
   <div class="flexslider">
     <ul class="slides">
    <li>
     <a href="#"><img src="../images/main/img1.jpg" alt="" /></a>
     <a href="#"><img src="../images/main/img2.jpg" alt="" /></a>
    </li>
    <li><img src="../images/main/img1.jpg" alt="" /></li>
     </ul>

   </div>
   <p class="clr"></p>

   <p class="clr"></p>
   <p class="today01"><input type="checkbox" name="layer_popup1" id="popup_layer1" value="checkbox" /><label for="popup_layer1"> 오늘 하루 열지 않음</label></p>
   <p class="pop_close"><img src="../images/main/btn_close.gif" alt="닫기" /></p>
  </div>
 </div>
</div>