Advanced Search

A function that uses images to perform a countdown.

/ Published in: JavaScript
Save to your folder(s)
Set the desired date within the function.
Make some images and label them "1.jpg, 2.jpg, 3.jpg, etc...".
That's how it's done.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <style type="text/css">
  2.   .countDown {
  3.     font-family:"Helvetica Neue",Helvetica,Calibri,"Liberation Sans",Arial,sans-serif;
  4.     font-weight:300;
  5.     letter-spacing:0.5px;
  6.     text-align:center;
  7.   }
  8. </style>
  9. <script type="text/javascript">
  10.   currentDate = new Date();
  11.   zeroDay = new Date("January 1, 2013"); // <===|INSERT_DATE_HERE
  12.   msPerDay = 864E5;
  13.   time = (zeroDay.getTime() - currentDate.getTime());
  14.   days= time / msPerDay;
  15.   dayCount = Math.floor(days);
  16.   image = parseInt(dayCount) + 2;
  17.   countDown ="<div id='countDown' class='countDown'>It's coming. Are you ready?<br>"+dayCount+" days until "+zeroDay+".</div>";
  18.   if (dayCount > 30){document.write(countDown);}
  19.   else if (dayCount <= 30){document.write("<img id='countDown' class='countDown' src='"+image+".jpg' alt='It's coming.'/>");}
  20.   else {document.write("<img id='countDown' class='countDown' src='1.jpg' alt=''It's coming.'/>");}
  21. </script>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.