Countdown timer, incl. until the new Year

A countdown timer is a fairly simple and classic task for javascript.

Example of a timer script before the New Year:

Consider creating a counter of days before a certain date and the same counter, but more old-school with a countdown of hours, minutes and seconds.

  < Script language = "JavaScript" type = "text / javascript" > function count ( ) {

 Month = 'Jan' ;
  // Month of the date of the event occurrence date = '01' ;
  // Date of occurrence of the event year = '2006' ;
  // Date of occurrence of the event

 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 + "days before your date!"
  ;
  // Message text to your taste if ( timer == "1" ) message = timer + "day after day" ;
  // Before the event, one day if ( timer == "0" ) message = "event in less than a day" ;
  // Up to an event of less than one day if ( timer == "-1" ) message = "event occurred" ;
  // Event occurred if ( timer < "-1" ) message = "" ;
  // Zero-length string after the event

 Document.  Write ( message ) ;
  } Count ( ) ;
  </ Script >

Option with days, hours, minutes and seconds ( countdown to the New Year ):

  < Script type = "text / javascript" > function newYearIn ( ) { var days = "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 = "days" } if ( RemainsFullDays == 1 || RemainsFullDays == 21 || RemainsFullDays == 31
 
  ) { Days = "day" } 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;'> Until the New Year there are:" + RemainsFullDays + days + RemainsFullHours + ":" + RemainsMinutes + ":" + lastSec + "</ p>" ;
  SetTimeout ( "newYearIn ()" , 10 ) ;
  }
 
  Else { document.  GetElementById ( "newyear" ) .  InnerHTML = "HAPPY NEW YEAR !!!"
  ;
  } } NewYearIn ( ) ;
  </ Script >

In order for the time counter (timer) before the New Year to appear on the page, you must place any tag with id = "newyear" before the script on the page, for example:

  <P id = "newyear"> Time remaining before the New Year </ p>

 <Script type = "text / javascript">
 Function newYearIn ()
 {...

And in the script itself set the date of the new year that you usually celebrate (for example, the nearest New Year in Russia: "Jan, 01,2011,00: 00: 00").

[UPD]: 1. In order to change the font (size and color), you need to remove the <font size = 20> and <font> tags and insert the style description p # newyear {font-size: 27px; Color: pink;} </ style> for the time line. 2. To split a string into two, insert the line "<br>" into the desired place, for example: "Before the New Year there are: <br>"