이벤트 팝업 /* 팝업 전체 배경 (딤드 처리) */ .popup-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); display: flex; justify-content: center; align-items: center; z-index: 9999; } /* 팝업 컨테이너 (이미지 비율 유지) */ .popup-container { position: relative; width: 90%; max-width: 400px; /* 원하는 팝업 최대 너비로 조절 가능 */ border-radius: 16px; overflow: hidden; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3); } .popup-container img { display: block; width: 100%; height: auto; user-select: none; -webkit-user-drag: none; } /* 공통 클릭 영역 스타일 (투명 버튼) */ .cta-area { position: absolute; cursor: pointer; background-color: transparent; border: none; padding: 0; margin: 0; display: block; /* 영역 위치를 눈으로 확인하려면 아래 주석을 해제하세요 */ /* background-color: rgba(255, 0, 0, 0.3); */ } /* 1. 노란색 '이벤트 차량 보러 가기' 버튼 영역 */ .btn-event { top: 74.2%; left: 14%; width: 72%; height: 9.8%; border-radius: 50px; } /* 2. 최하단 좌측 '오늘 하루 보지 않기' 영역 */ .btn-hide-today { bottom: 0; left: 0; width: 45%; height: 9.8%; } /* 3. 최하단 우측 '닫기' 영역 */ .btn-close { bottom: 0; right: 0; width: 25%; height: 9.8%; } const POPUP_ID = 'tcarEventPopup'; const STORAGE_KEY = 'hide_tcar_popup_date'; // 오늘 날짜 문자열 반환 (YYYY-MM-DD) function getTodayDateString() { const today = new Date(); const year = today.getFullYear(); const month = String(today.getMonth() + 1).padStart(2, '0'); const day = String(today.getDate()).padStart(2, '0'); return `${year}-${month}-${day}`; } // 페이지 로드 시 팝업 노출 여부 확인 window.addEventListener('DOMContentLoaded', function() { const savedDate = localStorage.getItem(STORAGE_KEY); const todayDate = getTodayDateString(); // 저장된 날짜가 오늘과 다르면 팝업 표시 if (savedDate !== todayDate) { document.getElementById(POPUP_ID).style.display = 'flex'; } }); // '닫기' 클릭 시 동작 function closePopup() { document.getElementById(POPUP_ID).style.display = 'none'; } // '오늘 하루 보지 않기' 클릭 시 동작 function hidePopupForToday() { const todayDate = getTodayDateString(); localStorage.setItem(STORAGE_KEY, todayDate); closePopup(); }