<HeadFirst_HTML5> O'REILLY_Chap.8_视频

<HeadFirst_HTML5> O’REILLY_Chap.8_视频

本博客的FollowMeReading系列初衷是在线的读书笔记. 为方便后期查阅, 故写成博客形式, 使用关键字查询便可以快读的找到相关的内容.

FollowMeReading系列所选的书籍一般选自O’REILLY或Apress出版社, 尽量保证笔记内容的权威性.

FollowMeReading系列的博客标题格式为: <书名> 出版社章节数章节名, 方便大家在纸质版书籍中查找.

FollowMeReading系列博文中的内容大部分是原文, 非原文部分前面将有’博主’字样提醒.

感谢<HeadFirst_HTML5>作者 Eric Freeman & Elisabeth Robson
感谢<HeadFirst_HTML5>翻译 林琪 张伶

正文

原文

BULLTE POINTS(要点):

• 可以使用 <video> 元素和一些简单的属性来播放视频.

• autoplay 属性在页面加载时就开始播放, 不过只应在适当的情况下使用.

• control 属性会使浏览器提供一组播放控件.

• 不同浏览器提供的控件的外观有所不同.

• 可以用 poster 属性提供你自己的海报图像.

• src 属性包含要播放的视频的URL.

• 对于视频和音频格式有很多”标准”.

• 3种常用的格式包括WebM, MP4/H.264和Ogg/Theora.

• 要了解你的观众, 从而知道需要提供哪些格式.

• 使用 <source> 标记来指定候选的视频格式.

• 在 <source> 标记中使用完全限定类型可以节省浏览器的工作和时间.

• 可以继续支持其他视频框架, 如FLash, 只需在video元素中添加一个作为后路的 <object> 标记.

• 视频对象提供了一组丰富的属性, 方法和事件.

• 视频支持播放, 暂停, 加载, 循环和静音方法及属性来直接控制视频的播放.

• 可以利用 ended 事件了解视频播放何时结束(例如, 来实现一个播放列表).

• 可以用 canPlayType 通过编程询问视频对象能不能播放某种格式.

• canPlayType 方法可能返回空串(不支持这种格式), maybe(可能可以播放这种格式)或者probably(它对能够播放这种格式很有信心).

• 画布可以用作为视频的显示表面, 来实现定制控件或视频的其他效果.

• 可以使用一个 scratch 缓冲区, 在将视频复制到显示表面之前先对视频进行处理.

• 可以使用 setTimeout 处理程序来处理视频帧. 尽管没有直接链接到视频的每一帧, 但这是目前最好的方法.

• 可以使用一个URL作为视频源来播放网络视频.

• 有些浏览器对视频有一个同源策略, 要求从源页面同样的来源提供视频.

• 关于视频很有可能出现错误, 特别是涉及到网络时.

• 利用 error 事件, 可以在视频获取, 解码及播放过程中出现错误时通知一个处理程序.

• video 元素依赖于渐进下载的视频. 目前对于流式视频还没有HTML5标准, 不过标准委员会正在寻求基于HTML的流式解决方案.

• 目前对于保护通过video元素分发的视频没有标准的方法.