<style>
#timer {
font-size: 1em;
align: center;
}
#gbsbm {
display: none;
}
</style>
<div id="timer">ОЖИДАЙТЕ: 00:00:00</div>
<script>
const timerElement = document.getElementById('timer');
const gbsbm = document.getElementById('gbsbm');
let countdown;
const countdownTime = 10000;
let endTime;
function startTimer() {
endTime = Date.now() + countdownTime;
// Сохраняем время окончания таймера в localStorage
localStorage.setItem('endTime', endTime);
updateTimer();
}
function updateTimer() {
const now = Date.now();
const remainingTime = endTime - now;
if (remainingTime <= 0) {
gbsbm.style.display = 'block';
timer.style.display = 'none';
clearInterval(countdown);
} else {
const hours = Math.floor((remainingTime / (1000 * 60 * 60)) % 24);
const minutes = Math.floor((remainingTime / (1000 * 60)) % 60);
const seconds = Math.floor((remainingTime / 1000) % 60);
timerElement.textContent = 'ОЖИДАЙТЕ: ' + `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
}
}
function checkTimer() {
const endTimeStored = localStorage.getItem('endTime');
if (endTimeStored) {
endTime = parseInt(endTimeStored, 10);
updateTimer();
countdown = setInterval(updateTimer, 1000);
} else {
startTimer();
countdown = setInterval(updateTimer, 1000);
}
}
document.addEventListener('visibilitychange', () => {
if (document.visibilityState = 'hidden') {
localStorage.removeItem('endTime');
clearInterval(countdown);
} else {
checkTimer();
}
});
checkTimer();
</script>
Почти то, что нужно. Но! При переключении вкладок в браузере - таймер останавливается.
А задача в том, что если посетитель находится на страницах моего сайта, просто свернул окно браузера, открыл вкладку с чужим сайтом, таймер не останавливался. В общем: таймер должен сбрасываться, если закрыты все мои страницы. Заранее благодарен