问题:视频设置自动播放,页面加载完成时正常播放,但刷新页面后不播放,循环播放失效。
自动播放以及循环播放的代码
<video muted autoplay="autoplay" loop="loop">
<source src="image/01.mp4" type="video/mp4"></source>
</video>
<!--muted:静音播放 注:高版本浏览器对视频静音后可以保证视频自动播放-->
<!--autoplay:自动播放-->
<!--loop:循环播放-->
source
- 为媒介元素(如 video 和 audio)定义媒介资源
- 允许规定可替换的视频/音频文件供浏览器根据它对媒体类型或编解码器的支持进行选择(可实现让媒体元素在不同浏览器下都支持播放)
- 是HTML5中的新标签
muted
- 属性是一个boolean(布尔)属性
- 设置或返回音频/视频是否应该被静音(关闭声音)
video
- 用来定义视频,比如电影片段或者其他视频流
- HTML5中的新标签
- 可以在开始标签和结束标签之间放置文本内容,这样老版本浏览器可以显示出信息
- 属性
属性 | 值 | 描述 |
---|---|---|
autoplay | autoplay | 如果出现该属性,则视频在就绪后马上播放 |
controls | controls | 如果出现该属性,则向用户显示控件,比如播放按钮 |
height | pixels | 如果设置视频播放器的高度 |
loop | loop | 如果出现该属性,则当媒介文件完成播放后再次开始播放 |
muted | muted | 规定视频的音频输出应该被静音 |
poster | url | 规定视频下载时显示的图像,或者用户点击播放按钮前显示的图像 |
preload | preload | 如果出现该属性,则视频在页面加载时进行加载,并预备播放。如果使用autoplay则忽略该属性 |
src | url | 要播放的视频的url |
width | pixels | 设置视频播放器的宽度 |
更多多媒体标签
embed
- 标签定义嵌入的内容,比如插件
- 可以用来插入各种多媒体,格式可以是Midi、Wav、AIFF、AU、MP3等等。url为音频或视频文件及其路径,可以是相对路径或绝对路径。
- HTML5中新标签
- 不同的浏览器对音频格式的支持也不同
audio
- 音频播放
- HTML5新标签