chromuim内核video audio标签自动播放

2022-05-18 16:02:20 阅读：166 来源： 互联网

方法1：设置静音播放

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    // 表示一打开就是静音播放
    <video controls autoplay muted loop style="width:500px;">
        // 为了兼容不同浏览器,显示MP4,不兼容则用webem
        <source src="media/open.mp4">
         <source src="media/open.webm">
         //浏览器不支持video才显示
          <p>
            对不起，你的浏览器不支持video元素，请点击这里下载最新版本的浏览器
        </p>
    </video>
</body>

</html>

注：

video
controls: 控制控件的显示，取值只能为controls

某些属性，只有两种状态：1. 不写 2. 取值为属性名，这种属性叫做布尔属性

布尔属性，在HTML5中，可以不用书写属性值

autoplay: 布尔属性，自动播放。

muted: 布尔属性，静音播放。

loop: 布尔属性，循环播放

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

方法2：关闭默认策略

chromuim 66 版本以后的内核，在默认情况下<video>和<audio>标签已经不能自动播放了。需要用户点击触发后才播放，或者要把播放设置为静音模式才可自动播放。

但很多情况下，我们希望用户看到这个标签后，就可以自动播放标签资源。还好，内核预留了设置开关。

我们可以使用 --autoplay-policy=no-user-gesture-required 来关闭这个默认策略

原文地址：

https://blog.csdn.net/qq_42931285/article/details/124139240

https://blog.csdn.net/jiangqin115/article/details/105746549

标签：audio,浏览器,属性,video,自动播放,静音,播放,布尔
来源： https://www.cnblogs.com/nsw2018/p/16285003.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

chromuim内核video audio标签自动播放