如何在html5中自动播放视频
Posted
技术标签:
【中文标题】如何在html5中自动播放视频【英文标题】：How to auto play video in html5 【发布时间】：2019-09-28 08:28:16 【问题描述】：我的 inedx.html 是通过播放全屏视频开始的，当视频结束时，单击该按钮将出现在屏幕上，它将重定向到另一个页面，但我的问题是当我使用“自动播放静音”属性时音频静音我想播放视频和音频如何实现这一点。
$(document).ready(function()
// Hide the div
$(".btn").hide();
// Show the div after 5s
$(".btn").delay(1000).fadeIn(1000);
);
function ak()
window.location.href = "indexpree.html";
*
padding: 0%;
margin: 0%
body
height: 100%;
width: 100%;
overflow: hidden;
.outerConatiner
position: relative;
height: 100%;
width: 100%;
.btn
position: absolute;
width: 500px;
height: 90px;
top: 800px;
left: 680px;
z-index: 1000;
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
<head>
<title>
</title>
</head>
<body>
<div class="outerConatiner">
<video autoplay muted>
<source src="./Intro.webm" type="video/webm">
Your browser does not support HTML5 video.
</video>
<img class="btn" src="./Enter Button.png" onclick="ak()">
</div>
</body>
</html>【问题讨论】：
你为什么使用muted属性？
如果我删除它那么它不起作用。
请检查this
HTML 5 Video "autoplay" not automatically starting in CHROME的可能重复
有人可以帮我处理这段代码吗..
【参考方案1】：
根据谷歌在 2018 年更新的自动播放策略
只有在以下情况下才允许自动播放声音：：
用户与页面进行了交互（点击、点击等） 在桌面上，用户的媒体参与指数阈值已被超过，这意味着用户之前播放过有声视频。 在移动设备上，用户已[将网站添加到他们的主屏幕]。【讨论】：
以上是关于如何在html5中自动播放视频的主要内容，如果未能解决你的问题，请参考以下文章