DEV Community

Discussion on: Improving my counter

View post

Replies for: Consider using String.prototype.padStart: developer.mozilla.org/en-US/docs/W.... You don't currently do anything with hours in the JavaScript, so t...

Collapse
 
granttransition profile image
Grant Smith • • Edited

This is fantastic, thank you. As for the numbers jumping around, I posted a gif at the top of the post. It is hopefully attached below, although this isn't that important.

One important thing though (customer request), I need the numbers to start from 01:34:06. Using your method, how would you set the starting numbers?

New Timer

Collapse
 
aleksandrhovhannisyan profile image
Aleksandr Hovhannisyan •

how would you set the starting numbers

Just in the HTML, if it's a fixed start. Otherwise you can just use JS to allow users to enter a start time.

Thread Thread
 
granttransition profile image
Grant Smith • • Edited

Yeah, that is exactly what I have done. Page loads with 01:32:20 and then changes the timer to 00:00:20.

<div class="column is-8 counter_container">
 <span id="hours" class="counter_number">01</span>
 <img class="divider" src="dist/svg/counter-divider.svg" alt="Counter divider" width="16" height="60">
 <span id="minutes" class="counter_number">32</span>
 <img class="divider" src="dist/svg/counter-divider.svg" alt="Counter divider" width="16" height="60">
 <span id="seconds" class="counter_number">20</span>
</div>

I'll keep working at it, the help is much appreciated, thank you