如何实现 pornhub 式的鼠标指向图片时显示视频预览？

[malagebidi]

最近在逛 pornhub 的时候，突然想把我的视频站也实现这种鼠标悬停预览的效果，类似于 https://codepen.io/anon/pen/VWypew

网址： http://koflegend.com/
其中用于视频预览的 mp4 文件我已经准备用 ffmpeg 分段去切然后合并了，然后 html 中视频地址写成 img 的一个属性，data-preview="http://xxx.com/xxx/xxx.mp4"，不知可操作否，然后问题主要是 js 部分，不知道代码改怎么写，请大神指点下。

[Finest]

pornhub 是什么东西？

[Laynooor]

@hand515 成人网站

[leots]

歪个楼，我感觉哔哩哔哩的鼠标指向图片显示预览视频做得更友好一些。
但也是不知道要怎么做

[binux]

放一个 video with poster，鼠标放上去就 play
最简单的，你搞个 gif 不就完了

[freshmanc]

@leots 说的是 （移动鼠标相当于移动时间轴）？

[malagebidi]

@leots 哔哩哔哩的做法： https://www.binpress.com/tutorial/how-to-generate-video-previews-with-ffmpeg/138
live demo: http://jsfiddle.net/r6wz0nz6/2/

[liangguan5]

我在 xhamster.com，redtube.com，avtaobao 上都见过楼主说的这种悬停预览效果(#^.^#)

[malagebidi]

@liangguan5 厉害了我的哥，再补充一个 xvideos.com

[malagebidi]

@binux 页面上图片太多 600+，这样 lazyload 延迟加载可能没法用了

[binux]

@malagebidi #9 看了下 xvideos.com，就是简单粗暴鼠标放上去播视频

[azh7138m]

这么多人收藏。。。

[ifreego]

pornhub 不是学习这个的吧

[charexcalibur]

怎么聊着聊着就发车了。。。

[0nlyy0u]

会因为这帖子，墙了 V2EX 么？