HTML5中添加多媒体支持（二）

接下来我们介绍一下如何嵌入Flash和Video或Audio，并且介绍一些在线生成嵌入代码的工具：

生成嵌入Flash代码的工具如下：

http://www.osmf.org/configurator/fmp/

其中：

1. Video Source输入嵌入的文件地址，可以输入视频文件的地址；
2. 其余选项根据需要设置；

输入完毕后甚至可以预览代码，设置正确后嵌入对应的页面即可；

例子中我们使用的代码如下：

   <video width="480" height="300" controls preload="auto" poster="../_video/podcast-poster.jpg">
     <source src="../_video/podcast.mp4" type="video/mp4" />
     <source src="../_video/podcast.webm" type="video/webm" />
     <source src="../_video/podcast.ogv" type="video/ogg" />
     <object width="480" height="300"> <param name="movie" value="http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf"></param><param name="flashvars" value="src=http%3A%2F%2Fwww.explorecalifornia.org%2F_video%2Fpodcast.mp4&poster=http%3A%2F%2Fwww.explorecalifornia.org%2F_video%2Fpodcast-poster.jpg"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="300" flashvars="src=http%3A%2F%2Fwww.explorecalifornia.org%2F_video%2Fpodcast.mp4&poster=http%3A%2F%2Fwww.explorecalifornia.org%2F_video%2Fpodcast-poster.jpg"></embed></object>
   </video>

音频的嵌入工具可以去 http://wpaudioplayer.com/standalone/下载js库并且参照对应的帮助设置即可。

为了支持视频的下载，我们可以使用<a>标签：

   <video width="480" height="300" controls preload="auto" poster="../_video/podcast-poster.jpg">
     <source src="../_video/podcast.mp4" type="video/mp4" />
     <source src="../_video/podcast.webm" type="video/webm" />
     <source src="../_video/podcast.ogv" type="video/ogg" />
     <object width="480" height="300" type="application/x-shockwave-flash" data="http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf">
       <param name="movie" value="http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf"></param>
       <param name="flashvars" value="src=http%3A%2F%2Fwww.explorecalifornia.org%2F_video%2Fpodcast.mp4&poster=http%3A%2F%2Fwww.explorecalifornia.org%2F_video%2Fpodcast-poster.jpg"></param>
       <param name="allowFullScreen" value="true"></param>
       <param name="allowscriptaccess" value="always"></param>
       <img src="../_video/podcast-poster.jpg" alt="No Video Support" title="No Video Support">
     </object>
   </video>
   <p>
     <strong>Download Video:</strong>
     <a href="../_video/podcast.mp4">MP4</a>,
     <a href="../_video/podcast.ogv">OGG</a>,
     <a href="../_video/podcast.webm">WebM</a>
   </p>

最后我们来介绍一个嵌入HTML5 video的在线工具： http://videojs.com/tag-builder/

HTML5规范中并没有强制定义一个标准的格式，主要原因就是阵营的不统一：

微软(IE)、苹果(Safari)、Adobe(Flash)都仅支持H.264(MPEG-4/AVC)，但这个格式是有版权滴；

而Mozilla(Firefox)、google(Chrome)、Opera都支持OGG，这个格式是开放的，但目前支持的还是少数；

新版Mozilla(Firefox)、google(Chrome)、Opera还支持webm格式；

好吧，这一段确实太乱了，实在搞不清楚的大家也别想太多了，凑活着过吧