Таймер обратного отсчета, в т.ч. до Нового Года

Таймер обратного отсчета является довольно простой и классической задачей для javascript.

Пример работы скрипта таймера до Нового Года:

Рассмотрим создание счетчика дней до определенной даты и такой же счетчик, но более олдскульный с отсчетом часов, минут и секунд.

<script language="JavaScript" type="text/javascript">
function count() {
 
month = 'Jan';      // Месяц даты наступления события

date = '01';        // Число даты наступления события
year = '2006';      // Год даты наступления события
 

theDate = month + ' ' + date + ' ' + year;

 
  now = new Date();
  setdate = new Date(theDate);

 
  timer = (setdate - now) / 1000 / 60 / 60 / 24;

  timer = Math.round(timer);
 
var message = timer + " дней до вашей даты!";                 // Текст сообщения на ваш вкус

if (timer == "1") message = timer + " сообытие через день";   // До события один день

if (timer == "0") message = "событие менее чем через день";   // До события менее одного дня
if (timer == "-1") message = "событие наступило";             // Событие наступило

if (timer < "-1") message = "";                               // Строка нулевой длины после наступления события
 
document.write(message);

}
count();
</script>

Вариант с днями, часами, минутами и секундами (отсчет времени до наступления Нового Года):

<script type="text/javascript">

function newYearIn()
{
    var days=" дней "
    var now = new Date();

    var newYear = new Date("Jan,01,2011,00:00:00");
    var totalRemains = (newYear.getTime()-now.getTime());

    if (totalRemains>1)
    {
        var RemainsSec=(parseInt(totalRemains/1000));

          var RemainsFullDays=(parseInt(RemainsSec/(24*60*60)));
        if (

            RemainsFullDays==2 ||
            RemainsFullDays==3 ||
            RemainsFullDays==4 ||

            RemainsFullDays==22 ||
            RemainsFullDays==23 ||
            RemainsFullDays==24 ||

            RemainsFullDays==32 ||
            RemainsFullDays==33 ||
            RemainsFullDays==34

            ) {
            days=" дня "
        }
        if (
            RemainsFullDays==1 ||

            RemainsFullDays==21 ||
            RemainsFullDays==31 
            ) {
            days=" день "

        }
          var secInLastDay=RemainsSec-RemainsFullDays*24*3600;
          var RemainsFullHours=(parseInt(secInLastDay/3600));

          if (RemainsFullHours<10){RemainsFullHours="0"+RemainsFullHours};
          var secInLastHour=secInLastDay-RemainsFullHours*3600;

          var RemainsMinutes=(parseInt(secInLastHour/60));
          if (RemainsMinutes<10){RemainsMinutes="0"+RemainsMinutes};

          var lastSec=secInLastHour-RemainsMinutes*60;
          if (lastSec<10){lastSec="0"+lastSec};

        document.getElementById('newyear').innerHTML = "<p style='font-size:22px;'>До Нового Года осталось: "+RemainsFullDays+days+RemainsFullHours+":"+RemainsMinutes+":"+lastSec+"</p>";

          setTimeout("newYearIn()",10);
    } 
      else {document.getElementById("newyear").innerHTML = "C НОВЫМ ГОДОМ !!!";}

}
newYearIn();
</script>

Для того чтобы счетчик времени (таймер) до Нового Года появился на странице, необходимо до скрипта на странице расположить любой тег с id="newyear", например:

<p id="newyear">Время, оставшееся до наступления Нового Года</p>

<script type="text/javascript">
function newYearIn()
{ ...

а в самом скрипте установить ту дату нового года, которую вы обычно празднуете (например, ближайший Новый Год в России: "Jan,01,2011,00:00:00").

[UPD]: 1. Для того чтобы поменять шрифт (размер и цвет), нужно убрать теги <font size=20> и <font> и вставить описание стиля <style>p#newyear {font-size:27px; color:pink;}</style> для строки времени. 2. Для того чтобы разбить строку на две вставьте в нужное место строки "<br>", например так: "До Нового Года осталось: <br>"