chrisnajman / twenty-four-hour-timer

Add a time in hours/minutes/seconds and launch a countdown timer.

permalink
/index.html

Website (Git Pages)

24 Hour Timer

Description

• Add a time in hours/minutes/seconds and launch a countdown timer.
• • Browser error messages appear if values entered are outside of the range, i.e.
• • • Hours: 0-23
• • • Minutes: 0-59
• • • Seconds: 0-59
• • A custom error message is displayed if the input is zero.
• When the time has elapsed, the message "Time's up!" is displayed, and an audio alarm starts to play.
• Clicking the 'Close' button or the modal background, at any time, closes the timer and reloads the page.

This is an extension of my Minute Timer:

• GitHub repository
• Git Pages

HTML

• template used for timer.

Javascript

• ES6 (no transpilation to ES5)

CSS

• grid used for page layout.
• flexbox used for page elements.
• Responsive.

Testing

• Tested on:
  • Windows 10
    • Chrome
    • Firefox
    • Microsoft Edge

Acknowledgements

• setMultipleAttributes function by Migel Hewage Nimesha