📢《明校網》即將搬家!內容已登陸《香港學校網》,繼續為大家提供選校及升學資訊。立即探索全新網站,體驗更多精彩內容!
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
z-index: 9999999999;
}
.popup {
position: relative;
background-color: #fff;
padding: 20px;
border-radius: 20px;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
text-align: center;
max-width: 600px;
width: 75%;
}
.popup h3 {
margin: 0 0 10px 0;
color: #646464;
font-size: 1.4rem;
}
.popup p {
margin: 0;
color: #666;
font-size: 16px;
line-height: 1.5;
}
.countdown {
font-weight: bold;
color: #646464;
font-size: 2.5rem;
}
.close-btn {
position: absolute;
top: 10px;
right: 10px;
width: 30px;
height: 30px;
border: none;
background: none;
cursor: pointer;
padding: 0;
}
.close-btn::before,
.close-btn::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 20px;
height: 2px;
background-color: #999;
transition: background-color 0.3s;
}
.close-btn::before {
transform: translate(-50%, -50%) rotate(45deg);
}
.close-btn::after {
transform: translate(-50%, -50%) rotate(-45deg);
}
.close-btn:hover::before,
.close-btn:hover::after {
background-color: #333;
}
.button-group {
margin-top: 10px;
display: flex;
justify-content: center;
gap: 15px;
}
.button {
padding: 8px 24px;
border: none;
border-radius: 25px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s;
}
.cancel-btn {
background-color: #7DB588;
color: #fff;
}
.cancel-btn:hover {
background-color: #7DB588;
}
let timeLeft = 5;
const countdownElement = document.getElementById('countdown');
const overlay = document.getElementById('overlay');
const closeBtn = document.getElementById('closeBtn');
const cancelBtn = document.getElementById('cancelBtn');
let countdownTimer;
function startCountdown() {
countdownTimer = setInterval(() => {
timeLeft--;
countdownElement.textContent = timeLeft;
if (timeLeft {
if (e.target === overlay) {
closePopup();
}
});
if (location.pathname === '/homepage' || location.pathname === '') {
overlay.style.visibility = "visible";
cancelBtn.addEventListener('click', closePopup);
startCountdown();
}