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的使用的更多相关文章

  1. 【转】视频H5 video最佳实践

    原文地址:https://github.com/gnipbao/iblog/issues/11 随着 4G 的普遍以及 WiFi 的广泛使用,手机上的网速已经足够稳定和高速,以视频为主的 HTML5 ...

  2. H5 video自定义视频控件

    1.自定义效果截图 2.效果源码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  3. H5 video poster属性—设置视频封面

     打开一个视频,在点击播放之前会看到一张封面图,点击之后封面消失,随即播放视频.   若现有一需求,要你自定义给某个视频设置封面,应该怎么做呢?   此时可使用H5 video提供的poster属性即 ...

  4. H5 video全屏与取消全屏兼容

    H5 video全屏与取消全屏各浏览器兼容,  requestFullscreen()全屏方法,exitFullscreen()退出全屏方法.兼容各个浏览器与css3兼容一样加个前缀即可. // 全屏 ...

  5. H5 video 标签 详解

    昨天使用H5  video 标签 写了视频播放   本打算参考爱奇艺的代码进行修改  发现 它是动态数据  静态页面需要拆解代码 我情急之下  使用了  video   整理一下笔记   后面有人用 ...

  6. H5——video百花齐放(浏览器自带的播放器)

    前言 手机自带浏览器的H5播放器 真是百花齐放啊(各个手机厂家有各个厂家的控件UI) 需求 手机浏览器木有控件条 自动播放 全屏处理 监控进度条 快进后退 自动播放 自动播放就给跪了 ios 安卓 为 ...

  7. H5 video标签视频加载存在的问题

    客户发现上传的视频无法播放,然后主管让我解决这个问题,这个页面不是我负责的,我看了代码,发现视频用的h5标签video标签加载视频.我看了没问题,然后 我先用ie浏览器打开,视频加载没问题.然后我给主 ...

  8. 视频H5のVideo标签在微信里的坑和技巧

    随着 4G 的普遍以及 WiFi 的广泛使用,手机上的网速已经足够稳定和高速,以视频为主的 HTML5 也越来越普遍了,相比帧动画,视频的表现更加丰富,前段时间开发了一个以视频为主的移动端 HTML5 ...

  9. H5 video踩坑实录

    前段时间公司APP做了一个APP论坛会议,嵌入了h5播放器.我以为很简单,没想到,这正是我踩进泥潭的开始... (想要吸取经验的小伙伴可以慢慢往下看,想要解决方案的直接看最后!) 一.一开始我以为直接 ...

随机推荐

  1. mybase 用户教程

    一.安装.卸载 1.安装 在Mac OS X环境下,可通过打开下载的.dmg文件,再把myBase图标拖到应用程序文件夹即可安装.然后通过双击程序图标运行程序 2.卸载 对于Mac OS X,把myB ...

  2. 关于setInterval()你所不知道的地方

    前言:1.使用setInterval()的定时器会把事件运行的时间也包含在内,如果要精确算定时两个任务之间的时间,可以使用setTimeout()替换.2.当异步事件发生时,如mouse click, ...

  3. python2.7 学习笔记--列表的使用

    同其它编程语言一样,python也提供了丰富的数据结构,以方便数据的处理.本文介绍两种最基本的数据集合,列表和元组的使用. 一.列表使用介绍 可以理解为一个有序的序列.其使用方式举例如下: list= ...

  4. JS 初级(三)接上

    传送门 http://www.cnblogs.com/Sabo-dudu/p/5788197.html 现阶段我就了解了这么多,在以后的学习中,我会不断的更新,如果有什么不同的见解可以一块学习,谁有更 ...

  5. WinForm用户控件、动态创建添加控件、timer控件--2016年12月12日

    好文要顶 关注我 收藏该文 徐淳 关注 - 1 粉丝 - 3       0 0     用户控件: 通过布局将多个控件整合为一个控件,根据自己的需要进行修改,可对用户控件内的所有控件及控件属性进行修 ...

  6. 大型App要搞的几个系统

    路由模块: 解耦各个业务,统一收敛页面跳转,动态决策跳转实现:   鉴权模块:收敛鉴权项目(比如登录.输入密码.短信验证.扫脸),后台动态控制鉴权项目:   收银台:收敛支付,统一到收银台:   开关 ...

  7. android 4.4/5.1上使用aar的问题

    在Android6.0上可以使用LOCAL_STATIC_JAVA_AAR_LIBRARIES.build脚本会把指定的aar解压缩到临时目录,并将class.jar和res添加到对应的变量. LOC ...

  8. 解决NetBeans运行web项目时出现的“未能正确设置java DB”问题

    1.在NetBeans导航器中,点击"服务"选项卡: 2.展开"数据库"菜单: 3.在"Java DB"上右键 –> 选择" ...

  9. 修改组策略,禁止用户修改IP

    运行中打开gepdit.msc,依次打开用户配置,管理模板,网络,网络连接:在右侧将“禁止访问LAN链接组建的属性”.“为管理员启用windows2000网络连接设置”设置为已启用即可令用户无法访问网 ...

  10. VC++ : error LNK2001: unresolved external symbol "__declspec(dllimport) public: __thiscall std::basic_string<wchar_t,struct std::char_traits<wchar_t>

    最近学习Google Breakpad,将其用在了自己的项目中,编译的版本为VS2010,没有什么问题.但是为了和之前的程序兼容,需要使用VS2008版本的程序,于是又编译了VS2008版本的代码,但 ...