禁止video在ios系统中自动全屏播放
在移动端用video播放视频时,会自动全屏播放,我们可以用如下设置webkit-playsinline='true' playsinline='true'来禁止自动全屏播放。
<video width="100%" height="auto" id="videoPlay1" poster="/hyData/weixinPages/images/video-img.png"
controls=controls webkit-playsinline='true' playsinline='true'>
<source src="" type="video/mp4">
</video>
video的默认显示
在微信浏览器/safari/chrome上默认展示:poster
<video controls poster="/images/w3html5.gif">
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
您的浏览器不支持 video 标签。
</video>
视频铺满全屏
#video{
object-fit: fill;
}
视频结束时执行事件
$("#video").get(0).addEventListener("ended", function() {
}, false);