让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;
}
相关推荐
2501_9159184111 小时前
只有 Flutter IPA 文件,通过多工具组合完成有效混淆与保护
android·flutter·ios·小程序·uni-app·iphone·webview
2501_9159184118 小时前
除了 Perfdog,如何在 Windows 环境中完成 iOS App 的性能测试工作
android·ios·小程序·https·uni-app·iphone·webview
七月巫山晴19 小时前
【iOS】NSString&NSRange&NSCharacterSet
ios·cocoa·iphone
2501_915106321 天前
常见 iOS 抓包工具的使用方式与组合思路
android·ios·小程序·https·uni-app·iphone·webview
TheNextByte11 天前
如何将Mac上的联系人同步到 iPhone?
macos·cocoa·iphone
我不是8神1 天前
gin与gorm框架知识点总结
ios·iphone·gin
TheNextByte14 天前
如何在不使用iTunes的情况下将文件从iPhone传到电脑
电脑·cocoa·iphone
Digitally4 天前
如何轻松地将文件从 PC 传输到 iPhone
ios·iphone
游戏开发爱好者84 天前
如何使用 AppUploader 提交上传 iOS 应用
android·ios·小程序·https·uni-app·iphone·webview
Digitally4 天前
如何通过 4 种方法有效删除 iPhone 上的所有内容
iphone