H5 video的使用
html5 video使用记录:
1.<video>的基本属性:
preload: (预加载)iPhone支持,Android不一定支持;
poster: (封面图片)iPhone支持,Android不一定支持;
autoplay: (自动播放)iPhone中的Safari不支持,webview可能被开启。Android不一定支持;
loop: (循环播放)iPhone支持,Android不一定支持;
controls: (控制条)iPhone支持,大师需要开始播放了才显示,Android基本支持;
width: (宽度);
height: (高度);
2.Media方法和属性:
Media.error; //null:正常
Media.error.code; //1.用户终止 2.网络错误 3.解码错误 4.URL无效
//网络状态
Media.currentSrc; //返回当前资源的URL
Media.src = value; //返回或设置当前资源的URL
Media.canPlayType(type); //是否能播放某种格式的资源
Media.networkState; //0.此元素未初始化 1.正常但没有使用网络 2.正在下载数据 3.没有找到资源
Media.load(); //重新加载src指定的资源
Media.buffered; //返回已缓冲区域,TimeRanges
Media.preload; //none:不预载 metadata:预载资源信息 auto:
//准备状态
Media.readyState; //1:HAVE_NOTHING 2:HAVE_METADATA 3.HAVE_CURRENT_DATA 4.HAVE_FUTURE_DATA 5.HAVE_ENOUGH_DATA
Media.seeking; //是否正在seeking
//回放状态
Media.currentTime = value; //当前播放的位置,赋值可改变位置
Media.startTime; //一般为0,如果为流媒体或者不从0开始的资源,则不为0
Media.duration; //当前资源长度 流返回无限
Media.paused; //是否暂停
Media.defaultPlaybackRate = value;//默认的回放速度,可以设置
Media.playbackRate = value;//当前播放速度,设置后马上改变
Media.played; //返回已经播放的区域,TimeRanges,关于此对象见下文
Media.seekable; //返回可以seek的区域 TimeRanges
Media.ended; //是否结束
Media.autoPlay; //是否自动播放
Media.loop; //是否循环播放
Media.play(); //播放
Media.pause(); //暂停
//视频控制
Media.controls; //是否有默认控制条
Media.volume = value; //音量
Media.muted = value; //静音
//TimeRanges(区域)对象:
TimeRanges.length; //区域段数
TimeRanges.start(index) //第index段区域的开始位置
TimeRanges.end(index) //第index段区域的结束位置
2.video相应的事件:
在不同的监听中进行各种操作,随心所欲。
未完待续......
H5 video的使用的更多相关文章
- 【转】视频H5 video最佳实践
原文地址:https://github.com/gnipbao/iblog/issues/11 随着 4G 的普遍以及 WiFi 的广泛使用,手机上的网速已经足够稳定和高速,以视频为主的 HTML5 ...
- H5 video自定义视频控件
1.自定义效果截图 2.效果源码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- H5 video poster属性—设置视频封面
打开一个视频,在点击播放之前会看到一张封面图,点击之后封面消失,随即播放视频. 若现有一需求,要你自定义给某个视频设置封面,应该怎么做呢? 此时可使用H5 video提供的poster属性即 ...
- H5 video全屏与取消全屏兼容
H5 video全屏与取消全屏各浏览器兼容, requestFullscreen()全屏方法,exitFullscreen()退出全屏方法.兼容各个浏览器与css3兼容一样加个前缀即可. // 全屏 ...
- H5 video 标签 详解
昨天使用H5 video 标签 写了视频播放 本打算参考爱奇艺的代码进行修改 发现 它是动态数据 静态页面需要拆解代码 我情急之下 使用了 video 整理一下笔记 后面有人用 ...
- H5——video百花齐放(浏览器自带的播放器)
前言 手机自带浏览器的H5播放器 真是百花齐放啊(各个手机厂家有各个厂家的控件UI) 需求 手机浏览器木有控件条 自动播放 全屏处理 监控进度条 快进后退 自动播放 自动播放就给跪了 ios 安卓 为 ...
- H5 video标签视频加载存在的问题
客户发现上传的视频无法播放,然后主管让我解决这个问题,这个页面不是我负责的,我看了代码,发现视频用的h5标签video标签加载视频.我看了没问题,然后 我先用ie浏览器打开,视频加载没问题.然后我给主 ...
- 视频H5のVideo标签在微信里的坑和技巧
随着 4G 的普遍以及 WiFi 的广泛使用,手机上的网速已经足够稳定和高速,以视频为主的 HTML5 也越来越普遍了,相比帧动画,视频的表现更加丰富,前段时间开发了一个以视频为主的移动端 HTML5 ...
- H5 video踩坑实录
前段时间公司APP做了一个APP论坛会议,嵌入了h5播放器.我以为很简单,没想到,这正是我踩进泥潭的开始... (想要吸取经验的小伙伴可以慢慢往下看,想要解决方案的直接看最后!) 一.一开始我以为直接 ...
随机推荐
- QEMU VCPU热插特性
最近学习QEMU中VCPU热插特性,需要了解QEMU中VCPU热插的整个流程,VCPU热插是QEMU主板的一个feature. 1:这里先分析一下QEMU的主板模拟,主板在QEMU的设备模型中对应的是 ...
- ubuntu 12.04 sever下安装jre
具体步骤如下: 首先打开http://www.java.com/en/download/linux_manual.jsp?locale=en 选择你想下载的版本,此处我选择的是jre-7u25-lin ...
- java开发问题总结-4-Maven使用问题汇总
Non-resolvable parent POM [INFO] Scanning for projects... [ERROR] The build could not read 1 project ...
- VB中PictureBox控件使用教程
PictureBox对象可以说是任何对象的原始型态,它可以加载图片.显示文字.画图外,它还能与Frame对象一样,在自己本身里头加载其它的对象而自成一个小群组,用PictureBox可以仿真出任何对象 ...
- .Net Framework认知
在托管代码的世界里,应用程序首先被加载到应用程序域(AppDomain)中,然后将应用程序域加载到进程中,一个进程可以包含多个应用程序域,也就是说一个进程可以包含多个应用程序,毕竟应用程序域之间的切换 ...
- pic
- BZOJ2134——单选错位
1.题意:这就是说考试的时候抄串了一位能对几个(雾) 2.分析:这是一个期望问题,期望就是平均,E(a+b)=E(a)+E(b),所以我们直接算出每个点能对几个就好,那么就是1/max(a[i],a[ ...
- Android控制ScrollView滚动
有两种办法,第一种,使用scrollTo(),这个方法不需要handler,直接调用就行 第二种方式,使用fullScrol() 下面我们看一下这个函数: scrollView.fullScroll( ...
- Oracle的SQL语句中的变量替换
一.问题描述 如下SQL: INSERT INTO tmp(val)VALUES('a&b'); 执行过程中会出现如下提示: 点击"确定"过后我们查看表中的数据: b后面的 ...
- html5 历史管理onhashchange和state
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...