代码改变世界

Html代码中插入视频

2009-12-25 10:42  coodoing  阅读(4980)  评论(2)  编辑  收藏  举报

  看到土豆，校内网上的视频播放功能，发现很新鲜，研究了一下。虽然实现起来比较困难，像土豆网这些网站都专门用js重写了播放器；但是后面发现如果只是简单的使用，其实很简单，只要在Html代码中插入支持视频的标签就Ok了。
  常用的方法：
  （1）：对flash支持：

 

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"
        width="600" height="450" title="myFlash">
        <param name="movie" value="css/40.swf" />
        <param name="quality" value="high" />
        <param name="scale" value="noscale" />
        <param name="LOOP" value="false" />
        <param name="menu" value="false" />
        <param name="wmode" value="transparent" />
        <embed src="css/40.swf" quality="high" pluginspage="http://www.tudou.com/programs/view/3aNvvf4GnGc/isRenhe=1"
            type="application/x-shockwave-flash" width="600" height="450" loop="false" salign="T"
            name="scriptmain" menu="false" wmode="transparent"></embed>
    </object>

 

 

其中宽度和高度都可以自己根据自己网页的需求进行调整，只要最后结果不变形就OK了；其中src可以自行变成自己所要的视频地址；

  （2）：嵌入Real播放器（除播放音频，还要播放视频）
  典型代码：

<embed src="http://www.56.com/n_v19_/c38_/12_/1_/jjbbjlm_/zhajm_121205177978_/97000_/0_/35997988.swf"
&nbsp;type=audio/x-pn-realaudio-plugin c c,controlpanel,statusbar height=245 width=450 autostart=false>
</embed>

 

 

以上的各小段代码，autostart=false可以不要。statusbar也可以不要。高和宽根据原来图像的大小照比例上调或下调，不变形就好了。

  （3）：WMA 播放器：

 

<embed src=音乐地址  height=？ width=450>

 

 ：： 450为最宽的适宜宽度

   其实还有对WMA播放器的支持，但是鉴于：可播视频只包括.wmv和.asf等Windows Media Player播放器可以自动伺候的（音频）视频文件。所以很少用到。

   （4）：一般在html嵌入视频，我直接使用：

<embed src=" http://www.tudou.com/v/k08828Zkvtg" width="450" height="400" loop="true" autostart="1" />

 

  （5）关于src视频地址的获取：

    一般像土豆这种专门做视频的网站上，最简单的方法就是：点击视频分享，贴到BBS或博客上；直接从里面获取src地址。

 

补充：http://gundumw100.javaeye.com/category/75990 可以参考，其中有挺多的html应用，比如天气预报，在网页中嵌入搜索引擎（百度，google）等等；

   还有就是现在有很多用JQuery做的多媒体插件，直接可以使用。加上现在HTML5对video标签的直接支持，使得web开发更加方便和快捷，不过只有ff3.5支持.