Creative Communities of the World Forums

The peer to peer support community for media production professionals.

Activity Forums Web Design (WordPress, Joomla, etc.) Countdown up timer html code

  • Countdown up timer html code

    Posted by Lucy Hird on November 24, 2009 at 4:27 pm

    Hello. I’m having a problem trying to add a count-up timer on my son’s webpage. What I’m trying to accomplish is:

    My name is Duncan, and I’m *years*, *months* old.

    I’d found this script, although because he was born in 2009, the scripts returns ‘infinity months’ on the webpage. Also, I can’t seem to remove the hours, minutes and second, to just leave the years and months without the whole thing collapsing. I’m just a newbie and I’ve already a headache. I wondered if anyone had any ideas?

    <script language="JavaScript1.2">

    //Dynamic countup Script- © Dynamic Drive (www.dynamicdrive.com)
    //For full source code, 100's more DHTML scripts, and TOS,
    //visit https://www.dynamicdrive.com

    function setcountup(theyear,themonth,theday){
    yr=theyear;mo=themonth;da=theday
    }

    //////////CONFIGURE THE countup SCRIPT HERE//////////////////

    //STEP 1: Configure the date to count up from, in the format year, month, day:
    //This date should be less than today
    setcountup(2008,3,14)

    //STEP 2: Configure text to be attached to count up
    var displaymessage="old"

    //STEP 3: Configure the below 5 variables to set the width, height, background color, and text style of the countup area
    var countupwidth='95%'
    var countupheight='20px' //applicable only in NS4
    var countupbgcolor='lightyellow'
    var opentags='<font face="Verdana"><small>'
    var closetags='</small></font>'

    //////////DO NOT EDIT PASS THIS LINE//////////////////

    var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
    var crosscount=''

    function start_countup(){
    if (document.layers)
    document.countupnsmain.visibility="show"
    else if (document.all||document.getElementById)
    crosscount=document.getElementById&&!document.all?document.getElementById("countupie") : countupie
    countup()
    }

    if (document.all||document.getElementById)
    document.write('<span id="countupie" style="width:'+countupwidth+'; background-color:'+countupbgcolor+'"></span>')

    window.onload=start_countup

    function countup(){
    var today=new Date()
    var todayy=today.getYear()
    if (todayy < 1000)
    todayy+=1900
    var todaym=today.getMonth()
    var todayd=today.getDate()
    var todayh=today.getHours()
    var todaymin=today.getMinutes()
    var todaysec=today.getSeconds()
    var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
    paststring=montharray[mo-1]+" "+da+", "+yr+" 10:00"
    dd=Date.parse(todaystring)-Date.parse(paststring)
    dyear=Math.floor(dd/(60*60*1000*24*365)*1)
    dmonth=Math.floor(dd/(60*60*1000*24*12)/(dyear*12))
    dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
    dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
    dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)

    if (document.layers){
    document.countupnsmain.document.countupnssub.document.write(opentags+dyear+" years, "+dmonth+" months, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds "+displaymessage+closetags)
    document.countupnsmain.document.countupnssub.document.close()
    }
    else if (document.all||document.getElementById)
    crosscount.innerHTML=opentags+dyear+" years, "+dmonth+" months, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds "+displaymessage+closetags

    setTimeout("countup()",1000)
    }
    </script>

    Lucy Hird replied 16 years, 5 months ago 3 Members · 9 Replies
  • 9 Replies
  • Curtis Thompson

    November 24, 2009 at 5:05 pm

    hello…

    i did a script like this for my niece – here’s a stripped out version of mine with a test function:

    https://sitruc.com/cow/age/

    note that the test doesn’t validate input, as the script would have a realistic date hard-coded into the variables…

    hope that helps!

    sitruc

  • Mike Smith

    November 24, 2009 at 5:08 pm

    You could try just deleting the unwanted hours, etc from the two display options – like

    <script language="JavaScript1.2">

    //Dynamic countup Script- © Dynamic Drive (www.dynamicdrive.com)

    //For full source code, 100's more DHTML scripts, and TOS,

    //visit https://www.dynamicdrive.com

    function setcountup(theyear,themonth,theday){

    yr=theyear;mo=themonth;da=theday

    }

    //////////CONFIGURE THE countup SCRIPT HERE//////////////////

    //STEP 1: Configure the date to count up from, in the format year, month, day:

    //This date should be less than today

    setcountup(2008,3,14)

    //STEP 2: Configure text to be attached to count up

    var displaymessage="old"

    //STEP 3: Configure the below 5 variables to set the width, height, background color, and text style of the countup area

    var countupwidth='95%'

    var countupheight='20px' //applicable only in NS4

    var countupbgcolor='lightyellow'

    var opentags='<font face="Verdana"><small>'

    var closetags='</small></font>'

    //////////DO NOT EDIT PASS THIS LINE//////////////////

    var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")

    var crosscount=''

    function start_countup(){

    if (document.layers)

    document.countupnsmain.visibility="show"

    else if (document.all||document.getElementById)

    crosscount=document.getElementById&&!document.all?document.getElementById("countupie") : countupie

    countup()

    }

    if (document.all||document.getElementById)

    document.write('<span id="countupie" style="width:'+countupwidth+'; background-color:'+countupbgcolor+'"></span>')

    window.onload=start_countup

    function countup(){

    var today=new Date()

    var todayy=today.getYear()

    if (todayy < 1000)

    todayy+=1900

    var todaym=today.getMonth()

    var todayd=today.getDate()

    var todayh=today.getHours()

    var todaymin=today.getMinutes()

    var todaysec=today.getSeconds()

    var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec

    paststring=montharray[mo-1]+" "+da+", "+yr+" 10:00"

    dd=Date.parse(todaystring)-Date.parse(paststring)

    dyear=Math.floor(dd/(60*60*1000*24*365)*1)

    dmonth=Math.floor(dd/(60*60*1000*24*12)/(dyear*12))

    dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)

    dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)

    dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)

    if (document.layers){

    document.countupnsmain.document.countupnssub.document.write(opentags+dyear+" years, "+dmonth+" months, "+dhour+" +displaymessage+closetags)

    document.countupnsmain.document.countupnssub.document.close()

    }

    else if (document.all||document.getElementById)

    crosscount.innerHTML=opentags+dyear+" years, "+dmonth+" months, "+displaymessage+closetags

    setTimeout("countup()",1000)

    }

    </script>

  • Lucy Hird

    November 24, 2009 at 8:39 pm

    Thanks Curtis… I am still stumbling a little bit, but getting nearer!

    https://www.dunkydoughnut.co.uk/home.html

    I can’t seem to get it to work within the table I’ve created. The text is there but the months and days are not. Perhaps I have an error somewhere in he code? Will keep pressing on.

  • Curtis Thompson

    November 24, 2009 at 8:51 pm
  • Lucy Hird

    November 24, 2009 at 9:51 pm

    Thank you for your help, but I fear I’ve made it worse now.

    https://www.dunkydoughnut.co.uk/home4.html

    I’m bundling through dreamweaver with no knowledge of web basics, using the templates have just confused me further. I’m sure I’ve still got stuff in the wrong place and I don’t understand it because I’ve a countdown to christmas timer on the index page which works fine. Gonna go and sleep on it I think.

  • Curtis Thompson

    November 24, 2009 at 11:45 pm

    hello….

    you have it minus one change – instead of this:

    <body bgcolor=”3399FE” onLoad=”MM_preloadImages(‘../elements/home%20rollover.gif’,’../images/home2.gif’,’../images/milestones2.gif’,’../images/family2.gif’,’../images/photos2.gif’,’../images/videos2.gif’,’../images/contact%20me2.gif’), “timeSince(BIRTH_MONTH, BIRTH_DAY, BIRTH_YEAR, ‘ageNow’)”>

    your body tag should be this:

    <body bgcolor=”3399FE” onLoad=”MM_preloadImages(‘../elements/home%20rollover.gif’,’../images/home2.gif’,’../images/milestones2.gif’,’../images/family2.gif’,’../images/photos2.gif’,’../images/videos2.gif’,’../images/contact%20me2.gif’),timeSince(BIRTH_MONTH, BIRTH_DAY, BIRTH_YEAR, ‘ageNow’)”>

    you just had an extra quote there after the last mouseover image argument and your function…

    sitruc

  • Lucy Hird

    November 25, 2009 at 3:44 pm

    It’s working brilliantly now. Thank you very much for all your trouble. You’re a 24 carat diamond! What a headache, time to open the wine.

  • Curtis Thompson

    November 25, 2009 at 3:51 pm

    hello…

    cool! glad it’s working. i have to ask – i picked this date randomly in the sample i made:

    var BIRTH_MONTH = 7;
    var BIRTH_DAY = 15;
    var BIRTH_YEAR = 2009;

    and you still have it there now – is that really his birthday? did i get that lucky in guessing? 🙂

    sitruc

  • Lucy Hird

    November 25, 2009 at 5:10 pm

    I’m afraid you’re not that lucky, he’s 8 months old. I’d uploaded several ‘home’ pages each with slight code variations sort of stabbing wildly in the dark for one that would work. I kept imputing the dates then pasting over it so many times I decided to not bother until I had something that worked, and do it last.

    The script is now fully operational at..

    https://www.dunkydoughnut.co.uk/home.html

    I think the problem was that I was trying to put the whole code in the table where I wanted it displayed because most of the body was locked in the page template I’d made, and I didn’t want to start changing that when it took me hours to make it to a servicable standard!

    REALLY thank you SO much

We use anonymous cookies to give you the best experience we can.
Our Privacy policy | GDPR Policy