地球村欢迎您!
Tag: 媒体文件预览模式: 图文 | 列表

js动态显示媒体文件播放时间

 功能描述

为多媒体元素<video>添加一个“onTimeUpdate”事件,用于改变播放文件位置时调用。另外,增加一个ID号为“spnTimeTip”的<span>元素,用于动态显示媒体文件播放的当前时间与总量时间。

实现代码

在DreamweaverCS5中新建一个HTML页面dome.html,加入代码如代码清单dome所示。

代码清单dome 通过timeupdate事件动态显示媒体间文件播放时

源码分析

在本实例中,当多媒体元素触发timeupdate事件时,调用_个自定义函数v_timeupdate()t在该函数中,分别使用整除与求余数的方法,分割多媒体元素当前时间(currentTime)属性与时间总量(duration)属性返回的秒值,组成分与秒的格式。在组成过程中,又调用了另外一个自定义函数RuleTime(),该函数可以将长度不足2位的数字,在前面加“0”进行补充,实现过程如Javascript代码中加粗部分所示。

查看更多...

Tags: 动态显示 媒体文件 播放时间

分类:学无止境 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 1