求助 V 友,这样的效果如何实现。

341 天前
 fqy12300

接到一个需求,见图。

设计要求,根据视频播放的时长,来动态切换左边的滚动条。

麻烦 V 友,可以提供下思路吗,或者给下类似的 Demo 。

我的想法是,根据视频时长来切换,好像不太行吧,应该是每次切换的时间都是固定,并且一样的吧。也就是只能匀速切换吧。

579 次点击
所在节点    前端开发
2 条回复
StateMa
341 天前
原生播放器窗口和第三方视频播放组件都支持获取当前视频播放进度。以 videojs 举例 currentTime 就能获取当前播放时间,你拿来除一下就获取到百分比(总时长也有现成参数)
左边像进度条的那玩意叫<b>步骤条</b>,网上找现成的也行,也可以绿皮版简单手搓一个,背景镂空设置一个蓝色 box 垫底,高度通过计算出的百分比动态赋值,圆圈部分自设节点如何到了就触发圆圈部分特效
fqy12300
340 天前
@StateMa 好的 谢谢,请问这种效果有专业的术语吗?我想去找找 Demo

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/957033

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX