westman Posted December 14, 2011 Share Posted December 14, 2011 i looked up a lot of examples of a count down clock and from them i still can not work out how to mack a 7 day clock counting down the timeany help? Link to comment Share on other sites More sharing options...
justsomeguy Posted December 14, 2011 Share Posted December 14, 2011 There are several pieces, so take them one at a time. The first step is to learn how to use Javascript date objects if you don't already. These pages describe the date object: http://www.w3schools.com/js/js_obj_date.asphttp://www.w3schools.com/jsref/jsref_obj_date.asp You need to be able to set a date object to a specific date (your target date), and set a date object to the current date. Once you have two date objects that represent the start and end, then the rest is math. The valueOf method returns a number that is the number of milliseconds since 1/1/70: http://www.w3schools.com/jsref/jsref_valueof_date.asp Once you have each date as the number of milliseconds, then you subtract them to get the difference. There are 86,400,000 milliseconds in one day, so to get the number of days you divide the difference by 86400000. You can use the math object and the modulus operator to get the number of days and the remainder: days = Math.floor(difference / 86400000);remainder = difference % 86400000; The remainder is less than a day now, so you use the same technique to get the number of hours plus remainder, minutes plus remainder, and seconds. So the first step is writing the code to calculate those values and write them to a page. Once you have that code, then you use setTimeout to keep running it every second to update a counter on the page: http://www.w3schools.com/js/js_timing.asp Keep in mind that the counter is the time between the clock on the user's computer and the date in their timezone, not the timezone on your server. Link to comment Share on other sites More sharing options...
westman Posted December 15, 2011 Author Share Posted December 15, 2011 i got this scripted... <form name="count"> <input type="text" size="69" name="count2"> </form> <script>/*Count down until any date script-By JavaScript Kit (www.javascriptkit.com)Over 200+ free scripts here!*///change the text below to reflect your own,var before="Christmas!"var current="Today is Christmas. Merry Christmas!"var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")function countdown(yr,m,d){theyear=yr;themonth=m;theday=dvar today=new Date()var todayy=today.getYear()if (todayy < 1000)todayy+=1900var 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+":"+todaysecfuturestring=montharray[m-1]+" "+d+", "+yrdd=Date.parse(futurestring)-Date.parse(todaystring)dday=Math.floor(dd/(60*60*1000*24)*1)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(dday==0&&dhour==0&&dmin==0&&dsec==1){document.forms.count.count2.value=currentreturn}elsedocument.forms.count.count2.value="Only "+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+beforesetTimeout("countdown(theyear,themonth,theday)",1000)}//enter the count down date using the format year/month/daycountdown(2011,12,25)</script> but this countdown is for 1 event a year and dose not reset the date how do i get it to 1 event a week and rest the date automatically?like a cron job in java script Link to comment Share on other sites More sharing options...
Ingolme Posted December 15, 2011 Share Posted December 15, 2011 Javascript can't remember anything, so you can't update the countdown for the next value. What you can do is find one particular date and time you know to count down to and hardcode that timestamp into your script, then when the script starts up keep adding 7 days to it until you reach a date that's after the current time. After that you display the countdown to that specified date. Link to comment Share on other sites More sharing options...
westman Posted December 15, 2011 Author Share Posted December 15, 2011 ok i got the...countdown(2011,12,25)tocountdown(<?php echo $mydate; ?>) now how would i get the php to find the date of the next Monday every 7 days? Link to comment Share on other sites More sharing options...
westman Posted December 15, 2011 Author Share Posted December 15, 2011 ok i now have the 7 day count and all in all looking like this... <div id="count"><?php$day = date('d');$month = date('m');$year = date('Y');$nextMonday = date("Y, m, d",strtotime('next Monday',mktime(0,0,0,$month,$day,$year)));?></div> <form name="count"><input type="text" size="69" name="count2"></form><script>/*Count down until any date script-By JavaScript Kit (www.javascriptkit.com)Over 200+ free scripts here!*///change the text below to reflect your own,var before="Christmas!"var current="Today is Christmas. Merry Christmas!"var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")function countdown(yr,m,d){theyear=yr;themonth=m;theday=dvar today=new Date()var todayy=today.getYear()if (todayy < 1000)todayy+=1900var 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+":"+todaysecfuturestring=montharray[m-1]+" "+d+", "+yrdd=Date.parse(futurestring)-Date.parse(todaystring)dday=Math.floor(dd/(60*60*1000*24)*1)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(dday==0&&dhour==0&&dmin==0&&dsec==1){document.forms.count.count2.value=currentreturn}elsedocument.forms.count.count2.value="Only "+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+beforesetTimeout("countdown(theyear,themonth,theday)",1000)}//enter the count down date using the format year/month/day//countdown(2012,12,25) countdown(<?php echo $nextMonday; ?>)</script> just have 2 questions...1. how do i get my output (document.forms.count.count2.value=current) in a div not a form?2. is the php and Javascript time from the server and not from the users pc, if not how do i set the time to the server or London, UK? Link to comment Share on other sites More sharing options...
thescientist Posted December 17, 2011 Share Posted December 17, 2011 1) give a <div> element somewhere on the page an id and use document.getElementById to assign current to its innerHTML property.2) Javascript will use the user's local time. PHP uses the servers time. If the server is in the timezone of the time being counted down to, you could just use php to echo out the current timestamp in milli's as well. That way the countdown is all "local" time to London/server. Link to comment Share on other sites More sharing options...
westman Posted January 2, 2012 Author Share Posted January 2, 2012 ok i got...<div id="count"></div> do i use ...document.getElementById.count.value=currentreturn} elsedocument.getElementById.count.value="Only "+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+before ? Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.