Home > Tutorials > JavaScript Snippets > The Time Since

The Time Since

There may be times when you want to be able to tell your visitors how long it was since your last birthday, your web site opened or even how old you are right down to the day. This can be done using JavaScript, as illustrated in the next paragraph.

The paragraph above - while rather static and inactive - is an example of this script working. To see this script in action I suggest you visit the site in a week or a month's time and check that it has changed - either that or you can change your system's date and the reload the page (but do remember to set it back to the correct date!)

I had a script similar to this one for a while at the site when it was hosted on Force9's servers - however I noticed that there were several flaws in the script that I used there. I couldn't enter the date as it was supposed to be in order to start my page as day one when I uploaded it. Also the biggest flaw I noticed is that a certain time each month - usually about a week before each month's anniversary - the script throws out the wrong value for the month - which annoyed me so much!

I have since tidied up the script but it is by no means flawless! First of all, it cannot tell you how many days there are to go until next Christmas, but it can tell you how long it has been since last Christmas. Although the code of the script is just below, you may want to just download the timesince.js file that has the functions in it - you can then use the link tag to include it in your pages.

<script language="JavaScript">

function y2k(number) {
  return (number < 1000) ? number + 1900 : number; }

var today = new Date();
var year = y2k(today.getYear());
var month = today.getMonth()+1;
var day = today.getDate();
var thisYear = year;
var thisMonth = month;
var thisDay = day;

function HowOld(day,month,year,thisDay,thisMonth,thisYear) {
  var yearsold = thisYear - year, monthsold = 0;
  var daysold = 0, string = '';
  if (thisMonth >= month) monthsold = thisMonth - month;
  else { yearsold--; monthsold = thisMonth + 12 - month; }
  if (thisDay >= day)daysold = thisDay - day;
  else {
    if (monthsold > 0) monthsold--;
    else { yearsold--; monthsold+=11; }
    daysold = thisDay + 31 - day; }
  if (yearsold < 0) return '';
  if ((yearsold == 0) && (monthsold == 0) && (daysold == 0))
    return '<p>The date specified is in the future.</p>';
  if (yearsold > 0) {
    string = yearsold + ' year';
    if (yearsold > 1) string += 's';
    if (monthsold > 0 && daysold > 0) string += ', ';
    else if (monthsold <= 0 && daysold <= 0) string += '';
    else {string += ' and '} }
  if (monthsold > 0) {
    string += monthsold + ' month';
    if (monthsold > 1) string += 's';
    if (daysold > 0) string += ' and '; }
  if (daysold > 0) {
    string += daysold + ' day';
    if (daysold > 1) string += 's'; }
  return string; }
</script>
<script language="JavaScript"> <!-- //
document.write(HowOld(29,6,1998,thisDay,thisMonth,thisYear));
//--></script>

In order to make this script suit your own sites needs you only need to do one of two things. Firstly you will need to change the text of the sentence that the function HowOld() produces on execution. Secondly you will need to change the first three parameters of the HowOld() function when you call it in your second script tag to reflect the date that you want to know how long it has been since.


Noticed a problem or got a question or comment?


This site will look much better in a browser that supports web standards, but it is still accessible to any browser or Internet device.


About this Page

Author: Rosemarie Wise
Originally Published: Fri 15th Dec, 2000
Last Revised: Sun 9th Dec, 2001
URL: http://websiteowner.info/tutorials/javascript/timesince.asp

Want to use this tutorial on your own site? Learn more...


The Web Site Owner's Resource © 2000-2007 Rosemarie Wise