设置视频海报的几种方式 可以直接给video标签添加poster属性,也可以使用js给video添加poster属性。
工具/原料
1
电脑
2
浏览器
3
编辑器
方法/步骤
1
直接给video标签添加poster属性
2
代码:效果图:
3
使用js给video添加poster属性。
4
代码:var video1 = document.getElementById('video1'); var videoSrc= 'images/poster.png'; video1.setAttribute('poster',videoSrc);效果图:
5
还有一种是使用js获取视频第一帧的截图 html和js代码:
6 效果图:
代码:
7
现在已经获取到 第一帧的截图,设置其css样式即可。