diff options
| author | Sam Potts <me@sampotts.me> | 2015-03-05 00:41:42 +1100 |
|---|---|---|
| committer | Sam Potts <me@sampotts.me> | 2015-03-05 00:41:42 +1100 |
| commit | 93e3f7cdd9f0e52b8c5d293c9caa6eaaadfb2718 (patch) | |
| tree | 79de2c1b793d60cb522948dd8f1bbb6b9d84e7db /controls.md | |
| parent | 617ae146c1487df481fc7a1ff54049958fb81b4b (diff) | |
| download | plyr-93e3f7cdd9f0e52b8c5d293c9caa6eaaadfb2718.tar.lz plyr-93e3f7cdd9f0e52b8c5d293c9caa6eaaadfb2718.tar.xz plyr-93e3f7cdd9f0e52b8c5d293c9caa6eaaadfb2718.zip | |
WIP on better seeking
Diffstat (limited to 'controls.md')
| -rw-r--r-- | controls.md | 6 |
1 files changed, 4 insertions, 2 deletions
diff --git a/controls.md b/controls.md index be530d52..b231acb1 100644 --- a/controls.md +++ b/controls.md @@ -22,6 +22,8 @@ This is the default `html` option from `plyr.js`. ```javascript ["<div class='player-controls'>", "<div class='player-progress'>", + "<label for='seek{id}' class='sr-only'>Seek</label>", + "<input id='seek{id}' class='player-progress-seek' type='range' min='0' max='100' step='0.5' value='0' data-player='seek'>", "<progress class='player-progress-played' max='100' value='0'>", "<span>0</span>% played", "</progress>", @@ -36,7 +38,7 @@ This is the default `html` option from `plyr.js`. "</button>", "<button type='button' data-player='rewind'>", "<svg><use xlink:href='#icon-rewind'></use></svg>", - "<span class='sr-only'>Rewind <span class='player-seek-time'>{seektime}</span> seconds</span>", + "<span class='sr-only'>Rewind {seektime} seconds</span>", "</button>", "<button type='button' data-player='play'>", "<svg><use xlink:href='#icon-play'></use></svg>", @@ -48,7 +50,7 @@ This is the default `html` option from `plyr.js`. "</button>", "<button type='button' data-player='fast-forward'>", "<svg><use xlink:href='#icon-fast-forward'></use></svg>", - "<span class='sr-only'>Fast forward <span class='player-seek-time'>{seektime}</span> seconds</span>", + "<span class='sr-only'>Fast forward {seektime} seconds</span>", "</button>", "<span class='player-time'>", "<span class='sr-only'>Time</span>", |