База знаний по программированию и не только
PHP HTML JavaScript
Осталось...

Навигация

Облако тегов
1 сентября, 2014, center, Html-теги, Manxter, noindex, text-align, Аварии, Видео, Воспитание, ДТП, Дети, Дизайн, Ель, Здоровье, Индексирование, Кресло, Мода, Нектар, Общество, Отсчет, Офис, Питание, Платья, Поведение, Покупка, Праздники, Ремонт, Свадьба, Семья, Сок, Сонник, Счетчик, Таблицы, Толкование, Тренд, Фрукты, Школа, Экономия, Яндекс

Показать все теги

Реклама

Опрос

Дата: 4-07-2011, 14:08, Добавил: Grozniy, Раздел: JavaScript
Простенький скрипт отсчета времени до определенной даты Вопросы, которые затрагивает статья:

Счетчик времени.
Скрипт отсчета времени.
Отсчет времени до нового года.

Предлагаю Вашему вниманию и рекомендую простенький javascript, который будет показывать в виде цифр количество дней, часов, минут и секунд до Нового года. Секунды показываются в реальном времени.

Обращаю Ваше внимание на то, что в скрипте "зашита" определенная дата - 1 января 2012 года. При наступлении этой даты придется вручную подправить данный скриптдля того чтобы установить новый отсчет. Поскольку скрипт достаточно короткий и почти интуитивно понятны, то подправить не составит труда даже домохозяйке, ни разу не слышавшей слова "жава (джава) скрипт".

Итак, вот сам код:

<script LANGUAGE="javascript"> 
document.write('<span id="ny_date">До Нового года</span>') 
function ojidanieNG() 

  var today = new Date(); 
  
  var BigDay = new Date("January 01, 2012"); 
  var timeLeft = (BigDay.getTime() - today.getTime()); 
  
  var e_daysLeft = timeLeft / 86400000; 
  var daysLeft = Math.floor(e_daysLeft); 
  
  var e_hrsLeft = (e_daysLeft - daysLeft)*24; 
  var hrsLeft = Math.floor(e_hrsLeft); 
  
  var e_minsLeft = (e_hrsLeft - hrsLeft)*60; 
  var minsLeft = Math.floor(e_minsLeft); 
  
  var seksLeft = Math.floor((e_minsLeft - minsLeft)*60); 
  
  if (BigDay.getTime() > today.getTime() ) 
  document.getElementById("ny_date").innerHTML = '<font color="#c00"><b>До Нового года осталось</b></font>: <b>'+daysLeft+'</b>дней <b>'+hrsLeft+'</b>час. <b>'+minsLeft+'</b>мин. <b>'+seksLeft+'</b>сек.'
  else 
  document.getElementById("ny_date").innerHTML = '<b>Поздравляем с <font color=red>Новым годом!</font>!!!</b>' 

setInterval("ojidanieNG()", 50) 
</script>

Если внимательно просмотреть строчки, то в глаза явно бросится строчка

  var BigDay = new Date("January 01, 2012");

Вот ее то и надо будет менять раз в год 1-го, 2-го или там 15-го числа желательно января месяца :) А заменить то надо всего лишь 2012 на следующий 2013 и т.д.

Просмотров: 16595, Комментариев: 5
Комментарий #1
Игорь 8 августа 2012 00:04 Группа: Гости
Здравствуйте! А что изменить чтобы шел отсчет правильно по Украине (на час меньше времени до Нового Года). Спасибо.
Комментарий #2
Grozniy 13 августа 2012 13:36 Группа: Администраторы
Для того, чтобы изменить время в зависимости от часового пояса внесем небольшое изменение.
Вместо одной сточки:
var timeLeft = (BigDay.getTime() - today.getTime());
вставим две:
var timeZone = 0;
var timeLeft = (BigDay.getTime() - today.getTime() + timeZone * 3600000);

timeZone может быть любым целым числом как положительным, так и отрицательным (количество часов). Теперь можно регулировать оставшееся время в любую сторону с точностью до часа.

Хотя, в этом не вижу никакого смысла. javascript запускается на клиентской машине, и отсчет времени берется с системных часов компьютера (а не сервера, на котором расположен сайт). Поэтому где бы посетители не открывали страницу с данным скриптом, у всех оставшееся время будет разным и соответствовать действительности, если, конечно, часы на компьютере показывают точное время именно в данном регионе.
Комментарий #3
Kom 17 августа 2012 18:56 Группа: Гости
СПС!! пригодился скриптег!!
Комментарий #4
Igor 6 ноября 2012 06:09 Группа: Гости
А есть возможность сделать чтобы скрипт считал сколько прошло времени от даты?
Комментарий #5
Сергей 8 июня 2013 06:41 Группа: Гости
Добрый день. Не могли бы вы расписать в комментариях, за что отвечает та или иная переменная и описать в целом работу скрипта? request Можно на почтовый ящик :)
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.

Самое читаемое

Календарь
«    Май 2018    »
ПнВтСрЧтПтСбВс
 123456
78910111213
14151617181920
21222324252627
28293031 

Полезное

Архив статей
Июль 2015 (1)
Декабрь 2014 (3)
Ноябрь 2014 (10)
Октябрь 2014 (4)
Июнь 2014 (1)
Январь 2014 (2)