본문 바로가기
html, css, javascript/javascript/jquery

[Jquery]레이어팝업 "오늘은 그만보기 / 닫기" 버튼 제이쿼리

by 허그미 2020. 2. 20.
반응형

[결과보기 - 캡쳐]

1 - html

2 - CSS


.wrap {min-width:1200px; margin:0 auto; position:relative;}
#popup {position:absolute;  top:100px; left:50%; transform:translateX(-50%);  z-index:1000; width:500px; height:500px; background:pink; display:none;}
table {width:350px; table-layout:fixed; text-align:center;margin:180px auto 0;}
table tr th { background:#eee;}
table tr td { background:#fff;}
.btn_list {display:table; table-layout:fixed; width:100%; height:50px; position:absolute;  bottom:0}
.btn_list span{ display:table-cell;  text-align:center; background:#eee;}
.btn_list span + span {border-left:1px solid #ddd}
.btn_list span a {display:block; height:100%; line-height:50px; text-decoration:none;}

3- Jquery

$( document ).ready(function() {
	cookiedata = document.cookie; 

	if ( cookiedata.indexOf("ncookie=done") < 0 ){ 
		document.getElementById('popup').style.display = "block";    //  팝업창 아이디
	} else {
		document.getElementById('popup').style.display = "none";    // 팝업창 아이디
	}
});

function setCookie( name, value, expiredays ) { 
	var todayDate = new Date(); 
	todayDate.setDate( todayDate.getDate() + expiredays );
	document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
}

function closeWin() { 
	document.getElementById('popup').style.display = "none";    // 팝업창 아이디
}

function todaycloseWin() { 
	setCookie( "ncookie", "done" , 7 );     // 저장될 쿠키명 , 쿠키 value값 , 기간( ex. 1은 하루, 7은 일주일)
	document.getElementById('popup').style.display = "none";    // 팝업창 아이디
}

반응형

댓글