SHARE
TWEET

Javascript Date Countdown

sweenig Jan 9th, 2014 1,239 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. function countdown(yr,mon,d,h,m,pastmessage,target){
  2.  //yr,mon,d,h,m are the Year, Month, Day, Hour, and Minute of the date the future event occurs
  3.  //pastmessage is the message to display when the event has already happened
  4.  //target is the target element to write the output to
  5.  var today=new Date();
  6.  var futuredate=new Date(yr,mon-1,d,h,m); //don't care why but the month has to be decremented
  7.  dd=futuredate-today; //this should be the difference in the two dates in milliseconds
  8.  dday=Math.floor(dd/(60*60*1000*24)*1); //find the number of days in dd
  9.  dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1); //find the number of hours in dd
  10.  dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1); //find the number of minutes in dd
  11.  var wholedmin=dmin;if (dmin < 10){wholedmin="0"+dmin;} //convert to 2 digits if necessary
  12.  dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1); //find the number of seconds in dd
  13.  var wholedsec=dsec;if (dsec < 10){wholedsec="0"+dsec;} //convert to 2 digits if necessary
  14.  if(futuredate<=today){
  15.   document.getElementById(target).innerHTML=pastmessage; //write this if the date is past
  16.  }
  17.  else {
  18.   document.getElementById(target).innerHTML= dday+ " days, "+dhour+":"+wholedmin+":"+wholedsec; //write this is futuredate is in the future
  19. }}
  20. </script>
  21. <div style="display:table-cell;background-image:url('http://www.highsnobiety.com/files/2013/01/star-wars-episode-7-vii.jpg');background-size:100% 100%;height:175px;width:276px;padding:5%;vertical-align:bottom;text-align:center;color:white;">
  22. <!--this div is the container for the element that gets updated every second.  Reformat as needed.-->
  23. <h1 id="starwars">
  24. <!--this element's inner content is re-written by the countdown function --></h1>
  25. </div>
  26. <br />
  27. <div style="display:table-cell;background-image:url('http://cdn.bleedingcool.net/wp-content/uploads/2013/06/doctor-who-logo-black.jpg?f6a06b');background-size:100% 100%;height:225px;width:276px;padding:5%;vertical-align:bottom;text-align:center;color:white;">
  28. <!--this div is the container for the element that gets updated every second.  Reformat as needed.-->
  29. <h1 id="drwho">
  30. <!--this element's inner content is re-written by the countdown function --></h1>
  31. </div>
  32. <script>
  33. var starwars = setInterval("countdown(2015,12,18,00,00,'It is out! Why are you not in the theater?','starwars')",1000); //this sets the starwars H1 element refreshing
  34. var drwho = setInterval("countdown(2013,11,23,13,00,'Mind: blown.','drwho')",1000); //this sets the drwho H1 element refreshing
RAW Paste Data
Top