Reputation: 133
I don't want to show playback speed in my video, is there any controls or controlList
properties to disable that option like controls disablepictureinpicture controlslist="nodownload"
Upvotes: 13
Views: 20262
Reputation: 1330
As of Chrome version 104 adding noplaybackrate
to controlsList
hides the "Playback Speed" from the menu, but users can still right-click on the video and choose "Show all controls" to bring it back!
Additionally, adding noplaybackrate
to controlsList
doesn't work in Firefox as of version 103.
What I did to force my video to play at regular rate (1) is to subscribe to onratechange
and bring it back to the playback rate that I want as below:
let video = document.getElementById(mediaElementId);
video.onratechange = function () {
video.playbackRate = 1;
};
Upvotes: 4
Reputation: 1770
you can add the following:
video.controlsList = "noplaybackrate";
however if you want to deactivate others as well, then as such:
video.controlsList = "noplaybackrate nodownload"
and you have the last one in the list "Picture in Picture"
disable this one as such:
video.disablePictureInPicture = true;
now your three dots are gone
and to be complete to also disable the full screen function
video.controlsList = "noplaybackrate nodownload nofullscreen"
Upvotes: 16
Reputation: 229
Add the parameter 'noplaybackrate' to controlsList. It works for me.
Upvotes: 18
Reputation: 1973
According to the docs only three options are available (nodownload
, nofullscreen
, and noremoteplayback
) and none seems to do what you want.
And you can't style the browser's default control set, but you can use the (JavaScript) Media API to build your own control set which of course you can style in any way that you like.
See this CodePen.
Upvotes: 4