08.02.2012, 11:33
|
Интересующийся
|
|
Регистрация: 23.05.2011
Сообщений: 16
|
|
обратный счетчик на сайте
Здравствуйте, уважаемые js программисты!
Подскажите, пожалуйста, как организовать на сайте обратный подсчет времени. Нужно выводить на сайте сколько дней осталось до события, а по окончанию времени вывести сообщение о том, что событие прошло.
Может есть готовый скрипт у кого-нибудь?
Заранее благодарю.
|
|
08.02.2012, 12:16
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
progns,
такой пойдёт?
function getDaysLeft() {
var daysLeft = (new Date(2012, 01, 09) - new Date())/1000/60/60/24;
daysLeft = daysLeft>0 && daysLeft<1 ? 1 : daysLeft;
if (daysLeft < 0) {
clearInterval(timer);
alert('Time is up!');
return;
}
alert(daysLeft);
}
var timer = setInterval(getDaysLeft, 1000*60);
getDaysLeft();
Последний раз редактировалось Seva1986, 08.02.2012 в 12:27.
|
|
08.02.2012, 13:33
|
Интересующийся
|
|
Регистрация: 23.05.2011
Сообщений: 16
|
|
Спасибо, но не совсем понимаю как им пользоваться.
выводит "1" Ваш код и все
|
|
08.02.2012, 14:04
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
Сообщение от progns
|
"1" Ваш код и все
|
ну потому что конечная дата стоит завтра а до завтра один день. Если поменять будет другое.
Я так понял вы скрипт совсем не знаете. напишите детальнее куда вам выводить эти данные например id элемента куда вывести число дней, и куда вывести сообщение об окончании времени
|
|
08.02.2012, 14:57
|
Интересующийся
|
|
Регистрация: 23.05.2011
Сообщений: 16
|
|
допустим, есть <div id="test"></div>. Здесь нужно выводить "до события осталось столько-то дней" , естественно с каждым днем уменьшается число (кстати надо выводить 3 дня, 5 дней, 1 день с правильными окончаниями) , а как доходим до заданной даты выводит сообщение о том что "событие прошло". Да, Js я не знаю, можно сказать.
|
|
08.02.2012, 15:23
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
progns,
Ок! вечером замучу...
|
|
08.02.2012, 15:28
|
Интересующийся
|
|
Регистрация: 23.05.2011
Сообщений: 16
|
|
допустим, есть <div id="test"></div>. Здесь нужно выводить "до события осталось столько-то дней" , естественно с каждым днем уменьшается число (кстати надо выводить 3 дня, 5 дней, 1 день с правильными окончаниями) , а как доходим до заданной даты выводит сообщение о том что "событие прошло". Да, Js я не знаю, можно сказать.
|
|
08.02.2012, 15:29
|
Интересующийся
|
|
Регистрация: 23.05.2011
Сообщений: 16
|
|
спасибо большое.
|
|
08.02.2012, 21:17
|
Профессор
|
|
Регистрация: 01.10.2011
Сообщений: 422
|
|
Вот вроде работает.
<!DOCTYPE HTML>
<html lang="ru">
<head>
<meta charset="UTF-8"/>
<title>Таймер</title>
<style>
#test {
color: red;
font-size: 30px;
}
</style>
</head>
<body>
<div id="test"></div>
<script>
function SetDaysTimer(dd, mm, yy, timerElement, message, timerUpdateTime) {
function getDaysLeft() {
var daysLeft = (new Date(yy, mm - 1, dd) - new Date()) / 86400000;
if (daysLeft > parseInt(daysLeft)) daysLeft = parseInt(daysLeft) + 1;
return daysLeft;
}
function formatDays(daysLeft) {
var doubleEnding = ('0' + daysLeft).slice(-2);
var singleEnding = ('0' + daysLeft).slice(-1);
if ((doubleEnding > 10 && doubleEnding < 20) || singleEnding > 4 || singleEnding == 0) {
return 'дней';
} else if (singleEnding == 1) return 'день';
return 'дня';
}
function showMessage(daysLeft) {
if (daysLeft < 0) {
timerElement.innerHTML = message;
clearInterval(timer);
return;
}
timerElement.innerHTML = daysLeft + ' ' + formatDays(daysLeft);
}
var timer = setInterval(function () {
showMessage(getDaysLeft())
}, (timerUpdateTime || 1) * 60000);
showMessage(getDaysLeft());
}
/* Использование
new SetDaysTimer(
dd, - число события
mm, - месяц события
yy, - год события
timerElement, - элемент куда выводить сообщение
message, - текст сообщения
timerUpdateTime - время обновления сообщения в минутах, по умолчанию 1 минута
);
Пример
*/
new SetDaysTimer(
21,
12,
2012,
document.getElementById('test'),
'Конец света наступил',
5
);
</script>
</body>
</html>
|
|
08.02.2012, 21:31
|
Интересующийся
|
|
Регистрация: 23.05.2011
Сообщений: 16
|
|
Спасибо огромное. То что нужно.
|
|
|
|