팝업 오늘하루보지않기 도와주세요 ㅠㅠ
본문
말그대로 오늘하루 보지않기 를 적용하고 싶은데 서치를 해서 적용해봐도 잘 안 되네요 ㅠㅠ
<div class="pp__main__pop__up">
<div class="pp__main__popup__bg"></div>
<div class="main__popup__box">
<div class="top__list">
<p class="tit">NEWS</p>
<div class="swiper-pagination"></div>
</div>
<div class="main__popup__contents__box">
<div class="swiper pp__main__popup__sw">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="/images/postpartum/main_popup_img.jpg" alt=""></div>
<div class="swiper-slide"><img src="/images/postpartum/main_popup_img.jpg" alt=""></div>
</div>
</div>
</div>
<div class="popup__close__box">
<a href="#" class="todays__btn">오늘 하루 보지 않기</a>
<a href="#" class="main__popup__close__btn">닫기</a>
</div>
</div>
</div>
답변 3
<script>
document.addEventListener('DOMContentLoaded', function() {
// 로컬 스토리지에서 상태 확인
const hidePopup = localStorage.getItem('hidePopup');
const popup = document.querySelector('.pp__main__pop__up');
// 상태에 따라 팝업 표시 여부 결정
if (hidePopup !== 'true') {
popup.style.display = 'block';
} else {
popup.style.display = 'none';
}
// "오늘 하루 보지 않기" 버튼 클릭 이벤트
document.querySelector('.todays__btn').addEventListener('click', function(e) {
e.preventDefault(); // 기본 링크 동작 방지
localStorage.setItem('hidePopup', 'true'); // 상태 저장
popup.style.display = 'none'; // 팝업 숨기기
});
// "닫기" 버튼 클릭 이벤트
document.querySelector('.main__popup__close__btn').addEventListener('click', function(e) {
e.preventDefault(); // 기본 링크 동작 방지
popup.style.display = 'none'; // 팝업 숨기기
});
});
</script>
그누보드의 팝업레이어 /bbs/newwin.inc.php
파일의 코드를 보면서 구현하시면 될 것 같습니다!
<script>
$(document).ready(function(){
// 쿠키 있으면 팝업 숨김
if ($.cookie('mainPopup') == 'hidden') {
$('.pp__main__pop__up').hide();
}
// 오늘 하루 보지 않기
$('.todays__btn').click(function(e){
e.preventDefault();
$.cookie('mainPopup', 'hidden', { expires: 1, path: '/' });
$('.pp__main__pop__up').hide();
});
// 닫기
$('.main__popup__close__btn').click(function(e){
e.preventDefault();
$('.pp__main__pop__up').hide();
});
});
</script>