<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元素分发的视频没有标准的方法.