让iPhone自带浏览器Safari能自动播放Video视频的办法

原以为在< video >标签上加入"autoplay" 属性就能自动播放了,没想到会受到浏览器的安全限制,会阻止视频的自动播放,具体说明可查看:

https://developer.mozilla.org/zh-CN/docs/Web/Media/Autoplay_guide

想让浏览器自动播放视频/音频媒体的具体解决方法如下:

1、首先要在video标签上加入必要的属性,例如:

html 复制代码
<video id="Video" playsinline muted preload autoplay loop>
	<source type="video/mp4" src='xxxx.mp4' />
</video>
  • 尤其注意需要设置 "音频文件静音或其音量设置为0"
  • 苹果设备还需要额外设置 "playsinline" 私有属性

2、如果还不能自动播放,就在js代码里加入video元素的play()事件

javascript 复制代码
document.querySelector("#Video").play();

3、如果还需要满屏显示,就给video加一个样式属性

css 复制代码
.video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
相关推荐
{⌐■_■}1 天前
【git】工作场景下的 工作区 <-> 暂存区<-> 本地仓库 命令实战 具体案例
大数据·git·elasticsearch·golang·iphone·ip·etcd
{⌐■_■}4 天前
【Viper】文件、Etcd应用配置与配置热更新,go案例
java·spring boot·struts·golang·iphone·ip·etcd
Black_Rock_br4 天前
iPhone 智能进化:Siri 调用 DeepSeek 大模型
ios·语言模型·iphone
苏金标7 天前
android 网络安全配置
android·web安全·iphone
打工人你好9 天前
iTunes 不能读取iPhone的内容
ios·iphone
2501_9044477413 天前
苹果iPhone 16 Pro Max上手体验:性能极致释放
智能手机·django·scikit-learn·iphone·tornado
高野44021 天前
【网络】3.HTTP(讲解HTTP协议和写HTTP服务)
网络·http·iphone
taopi20241 个月前
ios打包:uuid与udid
ios·iphone·ipad
fareast_mzh1 个月前
Customize ringtone on your iPhone
ios·iphone
wanfeng_091 个月前
视频m3u8形式播放 -- python and html
python·html·video·hls·m3u8