Interface for visually impaired


The player by default does not support screen readers. But you can create a lightweight special interface from the outside and link it to the player via the JS API. You can place this code on a page outside the player and show it always, or by clicking on a special button for the visually impaired.

<input type="button" value="Play" aria-label="Play" onclick="player.api('play')"/>
<input type="button" value="Pause" aria-label="Pause" onclick="player.api('pause')"/>
<input type="button" value="Volume -10%" aria-label="Volume -10%" onclick="player.api('volume','-0.1')"/>
<input type="button" value="Volume +10%" aria-label="Volume +10%" onclick="player.api('volume','+0.1')"/>
<input type="button" value="Seek -10s" aria-label="Seek -10s" onclick="player.api('seek','-10')"/>
<input type="button" value="Seek +10s" aria-label="Seek +10s" onclick="player.api('seek','+10')"/>
<input type="button" value="Full screen" aria-label="Full screen" onclick="player.api('fullscreen')"/>
Seeking: <input id="pjs_seek_hour" type="number" value="0" aria-label="Hours"/> :
<input id="pjs_seek_minute" type="number" value="0" aria-label="Minutes" /> : 
<input id="pjs_seek_second" type="number" value="0" aria-label="Seconds" />
<input type="button" value="Seek" aria-label="Seek" onclick="player.api('seek',document.getElementById('pjs_seek_hour').value*3600 + document.getElementById('pjs_seek_minute').value*60 + document.getElementById('pjs_seek_second').value)"/>
Speed: <input type="button" value="0.5" aria-label="0.5" onclick="player.api('speed','0.5')" />
<input type="button" value="Normal" aria-label="Normal" onclick="player.api('speed','1.0')" />
<input type="button" value="1.25" aria-label="1.25" onclick="player.api('speed','1.25')" />
<input type="button" value="1.5" aria-label="1.5" onclick="player.api('speed','1.5')" />
<input type="button" value="2" aria-label="2" onclick="player.api('speed','2.0')" />
<div id="player"></div>
<script>let player = new Playerjs({id:"player",file:"//site.com/video.mp4"});

Example

Seeking: : :

Speed:


19.10.9
2024 © PlayerJS

Sign up free

Sign up
By signing up, you agree to Terms of Service
Login if you have an account

Restore password

Restore
Forgot email? Contact us