如何设置鼠标悬停自动播放视频?

["wechat","weibo","qzone","douban","email"]

使用场景:

老板Tom希望自己的网站能够借鉴视频网站的优秀交互逻辑,进一步优化访客的视频播放交互体验,促进访客播放视频了解产品,收获更多成单机会。

发布功能:

当鼠标悬浮在视频列表组件的视频封面上时,自动播放视频内容,吸引访客点击视频封面进入视频详情页,进一步获取产品信息。


操作步骤如下:

步骤一:进入编辑网站——跳转到视频页面——添加视频列表组件;


视频列表1


第二步:鼠标悬停组件,点击设置按钮,选择任意风格,均可以实现鼠标悬停视频自动播放的效果;


视频列表2

视频列表3


动态效果图如下:

视频交互



相关文章