阿里云 Aliplayer高级功能介绍(六)：进度条标记

最新推荐文章于 2023-06-19 23:51:40 发布

原创

最新推荐文章于 2023-06-19 23:51:40 发布 · 773 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#阿里云播放器 #阿里云视频云

阿里云Aliplayer不仅提供进度条时间和缩略图功能，还支持内容提示打点。用户可以自定义打点内容、UI，通过事件监听、接口操作进行打点编辑与维护。在seek操作时，可以进入打点编辑状态，同时进度条上显示的打点内容在鼠标悬停时展示。未来，点播服务将提供API，自动从云端获取并显示打点信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

基本介绍

Aliplayer在进度条上提示时间和缩略图功能外，还可以进行视频内容的提示打点，当然不止是进度条上显示打点的内容，还提供一组接口，方便用户进行打点时间和内容的获取，基本UI如下图所示：

fb725a7d4f5ac9c5c5ac1fa1aec73d06f780d406

接口和属性介绍

播放器提供了progressMakers属性，是一个数组类型，每一条记录包含offset时间和text打点的内容，还可以包含其他属性，此属性用于告诉播放器进度条打点记录，记录内容属性说明：

名称	类型	说明
offset	Number	打点的视频偏移时间，单位：秒
text	String	打点的文本信息,默认UI会使用
isCustomized	Boolean	是否使用默认UI，不使用设置为true

事件

Aliplayer提供两个事件：鼠标进入进度条上的打点和鼠标离开进度条上的打点。

//鼠标进入进度条上的打点
player.on('markerDotOver', function(data) {
     let params = data.paramData，
     progressMarker = params.progressMarker, //打点记录信息
     left = params.left; //打点的离播放器左边的距离

 });

//鼠标离开进度条上的打点
player.on('markerDotOut', function() {
});