상단슬라이드 팝업창 소스 정보
상단슬라이드 팝업창 소스본문
우연히 상단 슬라이드 팝업창 소스 찾다가 일전에 왕계란님 소스에 닫기 버튼 만 추가하였습니다.^^
<!-- //////////////////////////// 2017.07.13상단 슬라이드 팝업창 /////////////////////////// -->
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<style type="text/css">
* { margin:0; padding:0; }
#close { font:bold 12px dotum; color:#fff; cursor:pointer; }
#div1 { background:#000; width:100%; height:80px; }
#div2 { width:100%; }
#div_laypopup { background:#ccc; }
</style>
<div id="div_laypopup" align="center" style="width:100%; display:none; height:100px; overflow:hidden;">
<div style="width:100%; text-align:right; vertical-align:bottom;">
<input type="checkbox" name="close" id="close" value="OK" onclick="closeWinAt00('div_laypopup', 1);"/><label for="close">오늘만 이 창을 열지 않음</label>
<button type="button" name="close" value="닫기" onclick="closeWin('div_laypopup', 1);"/>닫기</button>
</div>
</div>
<div id="div2">adfadf</div>
<script type="text/javascript">
openWin('div_laypopup');
// 창열기
function openWin( winName ) {
var blnCookie = getCookie( winName );
var obj = eval( "window." + winName );
if( !blnCookie ) {
obj.style.display = "block";
}
}
// 오늘하루 창닫기
function closeWinAt00(winName, expiredays) {
setCookieAt00( winName, "done", expiredays);
var obj = eval( "window." + winName );
//obj.style.display = "none";
$("#div_laypopup").animate({height:0}, 1000);
}
// 창닫기
function closeWin(winName) {
//setCookieAt00( winName, "done", expiredays);
var obj = eval( "window." + winName );
//obj.style.display = "none";
$("#div_laypopup").animate({height:0}, 1000);
}
// 쿠키 가져오기
function getCookie( Name ) {
var nameOfCookie = Name + "=";
var x = 0;
while ( x <= document.cookie.length ) {
var y = (x+nameOfCookie.length);
if ( document.cookie.substring( x, y ) == nameOfCookie ) {
if ( (endOfCookie=document.cookie.indexOf( ";", y )) == -1 ) {
endOfCookie = document.cookie.length;
}
return unescape( document.cookie.substring( y, endOfCookie ) );
}
x = document.cookie.indexOf( " ", x ) + 1;
if ( x == 0 ) break;
}
return "";
}
// 00:00 시 기준 쿠키 설정하기
// expiredays 의 새벽 00:00:00 까지 쿠키 설정
function setCookieAt00( Name, value, expiredays ) {
var todayDate = new Date();
todayDate = new Date(parseInt(todayDate.getTime() / 86400000) * 86400000 + 54000000);
if ( todayDate > new Date() ) {
expiredays = expiredays - 1;
}
todayDate.setDate( todayDate.getDate() + expiredays );
document.cookie = Name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
}
</script>
<!-- //////////////////////////// 2017.07.13상단 슬라이드 팝업창 끝/////////////////////////// -->
<!-- //////////////////////////// 2017.07.13상단 슬라이드 팝업창 /////////////////////////// -->
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<style type="text/css">
* { margin:0; padding:0; }
#close { font:bold 12px dotum; color:#fff; cursor:pointer; }
#div1 { background:#000; width:100%; height:80px; }
#div2 { width:100%; }
#div_laypopup { background:#ccc; }
</style>
<div id="div_laypopup" align="center" style="width:100%; display:none; height:100px; overflow:hidden;">
<div style="width:100%; text-align:right; vertical-align:bottom;">
<input type="checkbox" name="close" id="close" value="OK" onclick="closeWinAt00('div_laypopup', 1);"/><label for="close">오늘만 이 창을 열지 않음</label>
<button type="button" name="close" value="닫기" onclick="closeWin('div_laypopup', 1);"/>닫기</button>
</div>
</div>
<div id="div2">adfadf</div>
<script type="text/javascript">
openWin('div_laypopup');
// 창열기
function openWin( winName ) {
var blnCookie = getCookie( winName );
var obj = eval( "window." + winName );
if( !blnCookie ) {
obj.style.display = "block";
}
}
// 오늘하루 창닫기
function closeWinAt00(winName, expiredays) {
setCookieAt00( winName, "done", expiredays);
var obj = eval( "window." + winName );
//obj.style.display = "none";
$("#div_laypopup").animate({height:0}, 1000);
}
// 창닫기
function closeWin(winName) {
//setCookieAt00( winName, "done", expiredays);
var obj = eval( "window." + winName );
//obj.style.display = "none";
$("#div_laypopup").animate({height:0}, 1000);
}
// 쿠키 가져오기
function getCookie( Name ) {
var nameOfCookie = Name + "=";
var x = 0;
while ( x <= document.cookie.length ) {
var y = (x+nameOfCookie.length);
if ( document.cookie.substring( x, y ) == nameOfCookie ) {
if ( (endOfCookie=document.cookie.indexOf( ";", y )) == -1 ) {
endOfCookie = document.cookie.length;
}
return unescape( document.cookie.substring( y, endOfCookie ) );
}
x = document.cookie.indexOf( " ", x ) + 1;
if ( x == 0 ) break;
}
return "";
}
// 00:00 시 기준 쿠키 설정하기
// expiredays 의 새벽 00:00:00 까지 쿠키 설정
function setCookieAt00( Name, value, expiredays ) {
var todayDate = new Date();
todayDate = new Date(parseInt(todayDate.getTime() / 86400000) * 86400000 + 54000000);
if ( todayDate > new Date() ) {
expiredays = expiredays - 1;
}
todayDate.setDate( todayDate.getDate() + expiredays );
document.cookie = Name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
}
</script>
<!-- //////////////////////////// 2017.07.13상단 슬라이드 팝업창 끝/////////////////////////// -->
추천
3
3
댓글 6개
감사합니다
감사합니다
팝업창에 html 말고 태그가 먹이고 저런 js 적용되도록 하려면 어떻게 해야 하나요
좋아요..잘쓰겠습니다.감사합니다.
감사합니다
좋은 소스 공유 감사합니다 :)
혹시 이미지는 어디에 넣으면 될까요 ??
관리자 연동은 안되나요?
혹시 이미지는 어디에 넣으면 될까요 ??
관리자 연동은 안되나요?