
Developers
Player plugins
Developers
Player plugins
This is a helper plugin to enhance the Flowplayer Native accessibility features. The keyboard plugin allows to navigate and control player elements using keyboard shortcuts.
Load the plugin next to the core player and any other plugins (share, subtitles, quality selection) you require.
<script src="//cdn.flowplayer.com/releases/native/stable/flowplayer.min.js"></script>
<script src="//cdn.flowplayer.com/releases/native/stable/plugins/keyboard.min.js"></script>
Player and plugins exist in different release versions. Please see the release channel documentation.
To enable the plugin in the async cloud player, declare it in the "plugins": []
config object with keyboard
.
There is currently one config option to determine the seek step interval when using the arrow or character keys to seek in the timeline.
The option is configured in the keyboard:
root object.
Numbers below 1 are used as percentages of the whole running time (so 0.2
for a 40 second clip will result in an 8 second seek), 1
and above will seek in seconds.
seek_step
percentage (0-0.99) or seconds (1-x)keyboard: {seek_step: "20"}
or keyboard: {seek_step: "0.2"}
Switch the element focus by using <tab>
to select a button or bar and use the designated key to call an action.
If there is no focus on any specific element, you can toggle fullscreen, play/pause and mute directly with the respective keyboard commands. While an element is focused, only the actions connected to the element can be called.
<key>
elements<esc>
fullscreen or menu<spacebar>
play button and seek (progress) bar<m>
mute button and volume bar<f>
fullscreen buttonEsc
as well) <arrow up>
or <k>
volume bar<arrow down>
or <j>
volume bar<arrow left>
or <h>
seek (progress) bar<arrow right>
or <l>
seek (progress) barif you select a menu like HD
, audio selection
, subtitles
, share
or speed
, hit <spacebar>
or <enter>
to activate the menu and use the <arrow up>
<arrow down>
key to navigate to the desired list entry, then hit <spacebar>
or <enter>
<esc>
leaves the menu.
Codepen
Codepen
Codepen
Live streaming
Live analytics
Ad scheduling
Monetization