All geek questions in one place

HTML5 disables standard controls

I would like to know how to disable Showcontrols options for HTML5 video.

This is what I want to disable:

The reason I want to disable it is because if I use my custom controls and if I hover over it I will need to show my custom controls and when I leave the mouse it should hide the controls and The problem is that when you select ShowControls, the default controls are displayed, which I don’t want.

Can someone suggest me how to do this?

enter image description here

+4
source share
2 answers
var video = document.getElementById("video"); // assuming "video" is your videos' id video.removeAttribute("controls");

for example: http://jsfiddle.net/dySyv/1/

+10
source 

 var myVideo = document.getElementById("video"); function playPause() { if (myVideo.paused) myVideo.play(); else myVideo.pause(); } 
 <body> <video id="video" oncontextmenu="return false;" > <source src="https://www.html5rocks.com/en/tutorials/track/basics/treeOfLife/video/developerStories-en.webm" /> </video> <br> <button onclick="playPause()">Play/Pause</button> </body>

The videos are hidden here and in order not to include it by the user, I added oncontextmenu="return false;" . The context menu for the video is not displayed now. So the user cannot enable it.

(You can add custom context menus, as well as create custom controls for play / pause, search, time display and volume change using javascript.)

Hope this helps ... :)

0
source

Source: https://habr.com/ru/post/1403255/

More articles:


All Articles