HTML--video中的自动播放autoplay以及循环播放loop+更多多媒体标签

问题:视频设置自动播放,页面加载完成时正常播放,但刷新页面后不播放,循环播放失效。

自动播放以及循环播放的代码

<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中的新标签
  • 可以在开始标签和结束标签之间放置文本内容,这样老版本浏览器可以显示出信息
  • 属性
属性描述
autoplayautoplay如果出现该属性,则视频在就绪后马上播放
controlscontrols如果出现该属性,则向用户显示控件,比如播放按钮
heightpixels如果设置视频播放器的高度
looploop如果出现该属性,则当媒介文件完成播放后再次开始播放
mutedmuted规定视频的音频输出应该被静音
posterurl规定视频下载时显示的图像,或者用户点击播放按钮前显示的图像
preloadpreload如果出现该属性,则视频在页面加载时进行加载,并预备播放。如果使用autoplay则忽略该属性
srcurl要播放的视频的url
widthpixels设置视频播放器的宽度

更多多媒体标签

embed

  • 标签定义嵌入的内容,比如插件
  • 可以用来插入各种多媒体,格式可以是Midi、Wav、AIFF、AU、MP3等等。url为音频或视频文件及其路径,可以是相对路径或绝对路径。
  • HTML5中新标签
  • 不同的浏览器对音频格式的支持也不同

audio

  • 音频播放
  • HTML5新标签
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值