오늘 하루동안 열지않기 레이어 팝업

 

 

html

 

<div id="pop" style="visibility: visible;">
   <div>
   <a href="javascript:catalogapply();"><img alt="" src="팝업이미지 경로"></a>
   </div>
   <div class="close">
   <form name="pop_form">
   <div id="check"><input type="checkbox" name="chkbox" id="chkpop1" value="checkbox">오늘 하루동안 보지 않기</div>
   <div id="close" style="margin:auto;"><a href="javascript:closePop('pop','chkpop1');">CLOSE</a></div>
   </form>
   </div>
</div>

 

css 

 

#pop{position:absolute; // 이외에는 자기 마음대로 설정}
 .close div{float:left; text-align:right;}
 #check{font-size:12px; font-family:'돋움'; padding-left:10px;}
 #close{float:right; font-size:13px; padding:5px; font-weight:bold;}
 #close a {color:#fff;}

 

javascript 

 

1.head 태그 안에서 먼저 cookie 세팅을 해줘야한다.

 

 

 

 

2. 팝업 소스가 적힌 뒤에 적용되어야 하는 script가 있다. </body> 와 </html> 사이에 script 로 넣음.

 

<!--</body> 다음으로 와야하는 스크립트 -->

<script>
cookiedata = document.cookie;    
 if ( cookiedata.indexOf("pop=done") < 0 ){      
 document.all['pop'].style.visibility = "visible";
 } 
 else {
 document.all['pop'].style.visibility = "hidden"; 
 }
</script>