如何实现视频封面图的动态预览效果
Last updated
Last updated
在播放视频的入口页面，每个视频的封面图多数是静态图片，观众需要点击进入视频播放才能看到视频内容；如果想让观众不进入视频播放页面即可快速浏览视频内容，可以通过封面图的动态预览效果来实现。 当鼠标悬停在视频封面图上时，会加载动态预览图，并会随着鼠标的移动显示不同时间点的视频截图。
首先在页面中引用demo中的polyv-cover-preview.js文件，然后在需要显示动态预览效果的页面，嵌入以下代码：
其中，id为点播视频的vid，style中的width、height可设置为页面中需要显示的封面图宽高。 Demo下载： 点击下载Demo
只有时长大于5分钟的视频才会生成动态预览图，时长小于5分钟的视频只会显示静态的封面图。
