微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

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

亲爱的社区成员你好!

我已将视频背景设置为 Elementor 部分。

问题:通过 Firefox(从计算机)和 iPhone 浏览器查看页面时,会出现一个上下文菜单,允许在单独的窗口(“画中画”)中查看视频。 如果我正在考虑在视频顶部带有补充元素的视频页面设计,则此功能会破坏整个想法。如果您单击画中画上下文菜单,来自 Elementor 部分的视频将消失,整个部分为空。我不希望用户能够(无意或有意地)在视频页面上执行此操作。

我请您为这个问题提出一个可能的解决方案,以排除浏览器对视频的任何干扰。如何关闭视频元素的画中画?

示例:section with video background / picture-in-picture section

我找到了几种故障排除方法,但没有足够的技术知识来了解如何实施它们:

  1. 关于使用 disablePictureInPicture 属性
  2. 苹果avpictureinpicturecontroller

解决方法

<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>

如果你想通过 JavaScript 实现它

<video id="vid" controls muted>
<source src="https://www.w3schools.com/html/mov_bbb.mp4">
</video>
<script>
vid=document.getElementById("vid")
vid.disablePictureInPicture = true
</script>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。