HTML5VIDEO标签如何实现多个视频连续播放 html5中的audio和video标签怎么用
HTML5VIDEO标签如何实现多个视频连续播放?
新建个个video,指定播放列表的第一个视频路径为src。监听end事件,即一旦该视频播放完毕就回调里面把video的src改成列表的下一个,再play(播放)
代码示例:
var vList = [视频地址url1, url2, ...] // 初始化播放列表
var vLen = vList.length // 播放列表的长度
var curr = 0 // 当前播放的视频
var video = new Video()
video.addEventListener(end, play)
play()
function play(e) {
video.src = vList[curr]
video.load() // 如果短的话,可以加载完成之后再播放,监听 canplaythrough 事件即可
video.play()
curr
if (curr >= vLen) curr = 0 // 播放完了,重新播放
}
如此即可可以实现html5 播放多个视频连续播放
html5中的audio和video标签怎么用
就当正常标签用就行了,,,
它还有其它属性,比如autoplay自动播放,loop循环等,,
更高级的操作处理,,百度一下相关做法,,,
jQuery如何操作video标签里面的autoplay属性
这样肯定不行的,jQuery只是操作了DOM的属性,虽然为标签成功加上了autoplay属性,但视频框架早已经加载完成了,后加上的autoplay属性对其没有作用。应使用HTML5 Video自带的API来控制视频播放,下面的例子实现了鼠标悬停到视频上方自动播放,鼠标移出后自动暂停的效果:
$(function(){
var video = $(video.wp-video-shortcode)
video.hover(function(){
video[0].play() // play() 和 pause() 是HTML5中video自带的API函数,哈哈,方便吧?
},function(){
video[0].pause()
})
})