怎样获取HTML5视频的持续时间
HTML5视频的Bigger体验是非常令人振奋的,非常easy的道理,不用载入和依赖烦人的Flash或其它第三方插件来播放视频,也是大功一件。我们能够通过自己定义控件对视频进行显示和操控,当中一个常见的需求是显示视频的时长(duration)。以下我们一起来看看怎样获得并显示视频的持续时间!
JavaScript 代码
video 元素有一个属性(property)叫做 duration,表示的是视频内容的时间长度,单位是秒。
要比較好地显示视频的持续时间,我们须要使用到 parseInt 函数,以及取模运算(% , modulus ):
// 如果"video" 是获取的视频节点对象
var i = setInterval(function() {
// 这里注意, 必须推断视频的 readyState。
// 由于有可能没载入完。则获取到的视频时长信息是不对的。
if(video.readyState > 0) {
// 计算,10进制,以及取模
var minutes = parseInt(video.duration / 60, 10);
var seconds = video.duration % 60;
// (此处能够加入代码。将分钟,秒数显示到须要的地方)
// ...
// 运行到这里,就将循环定时器清除。
clearInterval(i);
}
}, 200);
原文链接: Get HTML5 Video Duration
原文日期: 2015年03月10日
翻译日期: 2015年03月14日
怎样获取HTML5视频的持续时间的更多相关文章
- 使用HTML5视频事件示例
<!DOCTYPE html > <html > <head> <title>Video events example</title> &l ...
- HTML5视频直播及H5直播扫盲
章来源:http://geek.csdn.net/news/detail/95188 分享内容简介: 目前视频直播,尤其是移动端的视频直播已经火到不行了,基本上各大互联网公司都有了自己的直播产品,所以 ...
- 使用 HTML5 视频事件
转自:http://msdn.microsoft.com/zh-cn/library/hh924822(v=vs.85).aspx 为什么要使用事件? HTML5 视频对象提供了很多事件,这些事件可以 ...
- HTML5 视频直播
目前视频直播,尤其是移动端的视频直播已经火到不行了,基本上各大互联网公司都有了自己的直播产品,所以对于直播的一些基本知识和主要技术点也要有所了解,本次分享就向大家介绍一下其中的奥秘. 内容大体框架: ...
- iOS 直播-获取音频(视频)数据
iOS 直播-获取音频(视频)数据 // // ViewController.m // capture-test // // Created by caoxu on 16/6/3. // Copyri ...
- HTML5视频Video 音频Audio
视频协议 视频格式 Flash HTML5 HTTP flv HTTP f4v HTTP mp4 HTTP m3u8 HTTP webm HTTP ogg RTMP flv RTMP f4v RTMP ...
- [转] Android 4.4中播放HTML5视频<video>的Bug
近期Nexus 4手机自动升级到Android4.4,本来挺好的一件事儿,结果发现自己的应用中出现一个Bug,应用中使用了Webview播放HTML5视频,代码如下: <video width= ...
- html5视频全频播放
html5视频全频播放 旋转90度 对video进行缩放 修正position 效果还凑合 代码 $(media).rotate({ // angle: 90, duration: 100, anim ...
- HTML5视频标签video
现阶段,我们要在网页中嵌入视频的最可靠最常用的办法是使用Flash,通过使用<object>和<embed>标签,就可以通过浏览器播放swf,flv等格式视频文件,但是前提是浏 ...
随机推荐
- AngularJS学习篇(九)
AngularJS XMLHttpRequest $http 是 AngularJS 中的一个核心服务,用于读取远程服务器的数据. $http.get('someUrl',config).then(s ...
- undefined 与void 0
参考:https://segmentfault.com/a/1190000000474941 Javascript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值.void 操作符用法 ...
- linux DHCP安装和测试
1.Yum 安装DHCP服务 2.拷贝模板配置文件,方便后期的配置修改. cp /usr/share/doc/dhcp-4.1.1/dhcpd.conf.sample /etc/dhcp/dhcpd. ...
- python3 selenium模拟登陆斗鱼提取数据保存数据库
# coding=utf-8from selenium import webdriverimport jsonimport timeimport pymongo class Douyu: def __ ...
- 用大白话扯扯那"神奇"的面向对象编程思维(一)
前言: 每当提到面向对象的时候,初学者肯定都是一脸懵逼的状态,到底什么是面向对象?会用面向对象后有什么牛逼之处吗?不会用是不是就会死掉?答案肯定不会死掉,我们可以来简单的举一 个栗子 1.当你想到熊猫 ...
- 【Tesseract】Tesseract 的训练流程
在泰迪杯A题中,我刚刚接触了Tesseact,其中训练字库中遇到了较多的问题.所以在此记录一下,也当做一个笔记,省得以后忘记. 为了方便 ,将tif命名格式设为[lang].[fontname].ex ...
- socket阻塞IO流程图
单线程 多线程
- javaweb学习方案1
一.JAVA环境变量的配置1.首先下载JDK JDK可以在Oracle(甲骨文)公司的官方网站http://www.oracle.com下载2.安装完成后查看JDK安装路径一般是C:\Program ...
- Linux的chattr与lsattr命令详解
Linux的chattr与lsattr命令详解 这两个命令是用来查看和改变文件.目录属性的,与chmod这个命令相比,chmod只是改变文件的读写.执行权限,更底层的属性控制是由chattr来改变的. ...
- NULL字段对于UNIQUE INDEX失效