I’m trying to hide a video when it is paused but the paused event is being triggered when you move the timeline on the video player as well. Is it possible to be able to adjust the video timeline without triggering the pause event?
var singleVideo = document.getElementById('single-video');
$(singleVideo).get(0).addEventListener('pause', function(){
$('#singleVideo').hide();
});
2
Answers
After clicking the timeline, the video pauses for a few seconds and continues to play.
HTML
A tricky thing is just to add the async function and wait for a second to get the video pause status.
JS
No. This is the standard procedure of how a browser works.
You need to create your own custom controls. This way your own pause button’s function would hide the video, whilst scrubbing the timeline itself would only just control seeking.
If you choose to use the browser’s built-in controls then you’ll have to think creatively.
For example: When using the timeline, the
pause
event is followed by aseeking
event, so just have a temporary listener for aseeking
event during thepause
event. Such "seeking" would let you know the video is not just paused and that it should remain visible. Without any extra "seeking" event, you can assume the video is trulypaused
…An example of the concept: