Question

您如何在html5视频上禁用画中画模式？

请注意，我指的不是与此相关的question 苹果的AVKit

我知道您可以使用controlsList="nodownload"禁用视频下载，画中画模式怎么可能。

<video controls controlsList="nodownload">
  <source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/mp4">
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/ogg">
</video>

Answer 1

根据规范https://dotnetfiddle.net/kCJMC4，控制它的属性是disablePictureInPicture

<video controls disablePictureInPicture controlsList="nodownload">
  <source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/mp4">
  <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/ogg">
</video>

Answer 2

如果要通过JavaScript进行操作。此代码适用于您页面上的所有视频，并且禁用了下载，拍照和右键单击上下文，其中还包含下载选项。

您可能希望将jQuery更改为$ 我写了这段代码，将其添加到WordPress中的主题中，以禁用网站中所有视频的下载。

jQuery('video').on("loadeddata", function() {
    jQuery('video').attr('controlsList', 'nodownload');
    jQuery('video').bind('contextmenu',function() { return false; });
    jQuery('video').attr('disablePictureInPicture', 'true');
});

如何在HTML5视频上禁用画中画模式

2 个答案: