Directory

← Back

scary-stopwatch

A simple stopwatch webcomponent

Author

Contributors

Rating

<scary-stopwatch>

A simple stopwatch web-component.

Most styling can happen directly on the element.

There's a custom property for the font-size of the milliseconds.

scary-stopwatch {
  font-size: 16px;
  --font-size-ms: 60%;
}

Supported methods of the element are:

.start(resume) - Starts the stopwatch. If resume is true the time will continue from when it was last stopped. Otherwise it will start from 00:00

.stop() - Stops the stopwatch.

.reset() - Resets the time to 00:00.

The current time (in ms) can be read from the .time property.

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Dependencies

  • @polymer/lit-element#^0.6.0
Released
2018-09-14
Maturity
IMPORTED
License
Apache License 2.0

Compatibility

Framework
Browser
Browser Independent

scary-stopwatch - Vaadin Add-on Directory

A simple stopwatch webcomponent scary-stopwatch - Vaadin Add-on Directory
# A simple stopwatch web-component. Most styling can happen directly on the element. There's a custom property for the font-size of the milliseconds. ``` scary-stopwatch { font-size: 16px; --font-size-ms: 60%; } ``` Supported methods of the element are: `.start(resume)` - Starts the stopwatch. If `resume` is true the time will continue from when it was last stopped. Otherwise it will start from 00:00 `.stop()` - Stops the stopwatch. `.reset()` - Resets the time to 00:00. The current time (in ms) can be read from the `.time` property.
Online