第 13 章 jQuery+HTML 5实现视频播放器 以往很多喜欢上网看视频、玩游戏的网友经常抱怨不爽，因为网上好多视频和游戏都需要安装Flash插件，并且速度非常慢。HTML 5标准的出现解决了这一难题，HTML 5提供了音频视频的标准接口，实现了无须任何插件支持，只需用户浏览器支持相应的HTML 5标签即可。难怪业内都坚信HTML 5标准是Flash的终结者！目前，IE9+、Safari、Firefox和Chrome等主流浏览器都支持HTML 5标准，用户可以免除Flash插件安装的烦琐而直接在网页中播放音视频。 图13.1是Youtube视频网站的HTML 5视频播放器页面。 图13.1 HTML 5视频播放器 本章主要内容 ? 使用MediaElement.js音视频播放器插件 ? 熟悉HTML 5音视频技术 ? 制作HTML 5页面音视频播放器 13.1 认识MediaElement.js插件 MediaElement.js音视频播放器插件是一个HTML 5音频和视频的解决方案，该插件支持使用HTML 5的音频和视频标签及CSS生成的音视频播放器。对于老的浏览器，MediaElement.js插件使用自定义的Flash或Silverlight播放器模拟HTML 5音视频技术。总体上，MediaElement.js是一款支持众多应用的音视频播放器插件，包括jQuery、Wordpress、Drupel、Joomla等，同时完全兼容目前主流浏览器（IE9+、Safari、Firefox和Chrome等）。 13.1.1 下载音视频播放器插件 MediaElement.js音视频播放器插件的官方网址如下： http://www.mediaelementjs.com/ 在MediaElement.js插件的官方网站，用户可以看到MediaElement.js插件的产品介绍、样例演示链接、源代码下载链接、开发向导链接、官方博客链接、支持文档以及网站版权信息等内容，如图13.2所示。 图13.2 查看产品介绍、样例演示链接等信息 用户继续向下浏览，可以看到MediaElement.js插件的特性介绍、浏览器支持与Demo演示链接等信息，如图13.3所示。 图13.3 查看特性介绍、浏览器支持等信息 目前，选择MediaElement.js音视频播放器插件是一个很不错的选择。MediaElement.js插件具有以下优秀特性，全方位支持设计人员开发： ? 自由联盟和开放源码支持，无许可限制。 ? 上手容易，安装部署简单快捷。 ? 使用纯HTML与CSS开发。 ? 完全支持HTML 5标准的