A small 60 FPS smooth progress bar. Usig the Web Animation API.
Method | Description | Related media event |
---|---|---|
set duration |
Set the duration of the animation. | durationchange |
set playbackRate |
Set the playbackRate of the animation. | ratechange |
start() |
Start the animation. | play |
stop() |
Stop the animation. | pause / ended |
CustomEvent | Description | event.detail keys |
---|---|---|
progress-bar:seek |
Sends the position to seek to in percent. | percent |
The colour of the progress is styled by the currentColor
CSS variable. That means that the parent of <progress-bar>
controls the colour of the progress via its color
prop in CSS.