I am a novice at web page design. I am trying to install count up timers in our sharepoint site to show the number of days without an accident. I can add a web part with Content Editor and paste the html code and it will work great. The problem comes that I need to add a second web part and use the same code again to display a second count up timer exactly like the first one but under a different heading. How do I accomplish this ?

What language is the counter written in? Or do you use some kind of service and just paste there code in? Have you tried to just add the same code again in the second spot? If so, what happened?

I found the code at dynamicdrive.com. It works great when I put it into my first webpart but when I past the same code into the second webpart, it kills the first webpart and the new webpart will flash back and forth between the two count up dates I selected. It is very frustrating. Below is the code I am using. Thanks for any help you can provide.



<style style="text/css">

.dcountstyle{ /*Example CSS to style count up output*/
font: bold 15px verona;
background: lime
}

.dcountstyle sup{ /*Example CSS to style count up output*/
font-size: 90%

}

</style>

<script type="text/javascript">

/***********************************************
* Dynamic CountUp script- © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

function dcountup(startingdate, baseunit){
this.currentTime=new Date()
this.startingdate=new Date(startingdate)
this.timesup=false
this.baseunit=baseunit
this.start()
}

dcountup.prototype.oncountup=function(){} //default action for "oncountup"

dcountup.prototype.start=function(){

var thisobj=this
this.currentTime.setSeconds(this.currentTime.getSeconds()+1)
var timediff=(this.currentTime-this.startingdate)/1000 //difference btw target date and current date, in seconds
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="Hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="Minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="Seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
var result={days: dayfield, hours:hourfield, minutes:minutefield, seconds:secondfield}
this.oncountup(result)
setTimeout(function(){thisobj.start()}, 1000) //update results every second
}

</script>

<div id="cpcontainer"> </div>

<script type="text/javascript">

//SYNTAX: myvariable=new dcountup(past_date_and_time_string, "baseunit")
var safety=new dcountup("August 3, 2009 00:00:00", "Days")
safety.oncountup=function(result){
//result is an object containing the current count up date/time, updated every second
//Available properties: result["Days"], result["Hours"], result["Minutes"], and result["Seconds"]
var mycountainer=document.getElementById("cpcontainer")
mycountainer.innerHTML="<br /><span class='dcountstyle'>"+result['days']+" ^days "+result['hours']+" ^hours "+result['minutes']+" ^minutes "+result['seconds']+" ^seconds</span>"
}

</script>

I think you just need to use another DIV with another id and then repeat the second script block and edit it accordingly. That is, if you give the new DIV the ID 'cpcontainer-II', you need to change the id used in the mycountainer variable (in the new script block) like so:



Could be done more elegantly I guess, but I think this will do.

Thank you so much for your help. That worked great.