Jump to content
Sign in to follow this  
mboehler3

Two functions won't run together

Recommended Posts

Hi, I'm trying to have a "count-up" timer on my website that displays seconds, minutes, hours, and days that have accumulated since a specific date. I'm not much of a JavaScript coder so I found a script online that seems pretty simple. It works just how I want for seconds, so I copied the code and replicated it for minutes. When I saved and refreshed my page, only the seconds display. http://www.wuzhannanan.com/alex/timeticker.html What do I need to do in order to display both seconds and minutes? Thank you in advance for any help.

  • Like 1

Share this post


Link to post
Share on other sites

why are you using document.write to execute a function? You realize the simplest solution to your original problem was just to create another HTML element to set the seconds too, instead of having them both "write" to the same element?

Share this post


Link to post
Share on other sites
why are you using document.write to execute a function? You realize the simplest solution to your original problem was just to create another HTML element to set the seconds too, instead of having them both "write" to the same element?
I'm sorry but no, I don't realize it... do you mean copying the code and using a different id? Like "counter2" instead of "counter"?

Share this post


Link to post
Share on other sites

I don't know what the original code looked like, but it was clear you were trying to output two pieces of information, but to the same element. So it seems as simple as having one element for minutes, and one element for seconds. That's what JSG was trying to tell you.

Share this post


Link to post
Share on other sites
Would have love to help, but i use mobile dev' and i cant view the source code. posting the code here, may help!
Thank you, here is what I am working with:
<div id="counter"><script>var START_DATE = new Date("August 20, 2006"); // put in the starting date herevar INTERVAL = 1; // in secondsvar INCREMENT = 1; // increase per tickvar START_VALUE = 1; // initial value when it's the start datevar count = 0;window.onload = function(){var msInterval = INTERVAL * 1000;var now = new Date();count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;document.getElementById('counter').innerHTML = count;setInterval("count += INCREMENT; document.getElementById('counter').innerHTML = count;", msInterval);}</script></div>

Share this post


Link to post
Share on other sites

Most of the time counters are done they only use one function to update the entire counter. It would look weird if the minutes and seconds changed on different schedules. To do that, first you need to define that function as a regular named function instead of just assigning it to window.onload, like it was before. Instead of setInterval you should use setTimeout, so that each time the function runs it schedules itself to run again on the next interval. The calculation can be changed to this: count = now.valueOf() - START_DATE.valueOf(); You end up with a variable called count which contains the number of milliseconds since the start date. You can use math to figure out how many years, months, days, hours, minutes, etc that represents. There are 86400 seconds in a day, so there are 86400 * 365 * 1000 milliseconds in a year. You would divide the count by that to get the number of years, and subtract from the total to get the remainder (or use the modulus operator). Divide the remainder by 86400 * 1000 to get the number of days remaining, etc. Do the same for hours, minutes, and seconds. Store each of those values in its own variable, and then at the end use the years, days, etc variables to update the element that you want to display the counter inside.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...