scary-stopwatch
A simple stopwatch webcomponent
<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.
Links
Compatibility
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#
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.