首页 > 建站教程 > html教程 >  我爱模版浅谈网页中插入flash的几种方法,用swfobject插入网页flash正文

我爱模版浅谈网页中插入flash的几种方法,用swfobject插入网页flash

先道明为什么要写这篇文章。目前,网页插入swf的方法五花八门,由于IE只支持对Object,而火狐,谷歌,Safari等只支持对Embed。又由于embed不能通过W3C验证。为了兼容各大主流浏览器,又为了通过W3C标准,所以,插入一个swf才变得复杂。下面,简单总结下常用网页插入flash的方法,并且说明各种方法的利弊。

方法一:Object和Embed混合写法。

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" 
   codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/
swflash.cab#version=7,0,0,0" 
   width="550" height="400" id="Untitled-1" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="mymovie.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="mymovie.swf" quality="high" bgcolor="#ffffff" width="550" height="400" name="mymovie" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
优点:没有兼容性问题。


缺点:1、无法通过W3C验证。

         2、由于使用了两种插入方法,设置参数时,要设置两次。

         3、微软由于种种原因,限制了 IE 的 ActiveX 的使用模式,就是在页面中的 ActiveX 有一个虚框,需要用户点击一次才能正常交互。Flash是作为一个 ActiveX 嵌入到网页中的,所以它也会受牵连,只有通过 JS 嵌入 Flash 才能解决这个问题。

         4、没有 Flash 版本检测,如果版本浏览器的flash插件版本不够,要么不能正常显示你的 swf 文件,要么会弹出一个 ActiveX 的确认安装的框。

方法二:Flash satay 即只用object,摒弃embed。

<object type="application/x-shockwave-flash
data="c.swf?path=movie.swf" 
width="400" height="300">
<param name="movie" 
value="c.swf?path=movie.swf" />
<img src="noflash.gif" 
width="200" height="100" alt="" />
</object>


优点:1、没有embed,能够通过W3C验证了。

         2、浏览器兼容性非常不错。

         3、没有embed,设置参数相对简单。

缺点:1、同第一种方法,仍旧会显示虚线框,如果flash插件版本不够,要么不能正常显示你的 swf 文件,要么会弹出一个 ActiveX 的确认安装的框。

         2、holder swf 来加载你的目标 swf 以保证 IE 中的 stream 能力,如果你需要通过 flashvars 来传参,或者和页面的 JS 交互,会很麻烦。

方法三:用JS嵌入(终极方法)。

这里有必要说下,js嵌入方法很多,有优有劣。SWFObject是比较好的方法。下面具体说说SWFObject的优缺点以及使用方法。

优点:1、完美兼容各大浏览器

         2、通过了W3C验证

         3、不会再产生虚线框,也不会弹出ActiveX 的确认安装的框

         4、。。。。。。
使用方法:使用方法一:

1、在head区引入下面代码

<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
    swfobject.registerObject("myId", "9.0.0", "expressInstall.swf");
</script>

2、把以下代码拷贝到你想引用的地方
<object id="myId" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="300" height="120">
    <param name="movie" value="test.swf" />
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="test.swf" width="300" height="120">
    <!--<![endif]-->
    <div>
        <h1>Alternative content</h1>
        <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.5imoban.net/uploads/allimg/140107/10030641b-0.gif" alt="Get Adobe Flash player" /></a></p>
    </div>
    <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
</object>

注:swfobject.registerObject("myId", "9.0.0", "expressInstall.swf");参数“myID”为object的ID,expressInstall.swf不是你要引入的flash,而是下载的插件里的flash,位置不能错。test.swf才是你要引入的flash。路径不能设置错,并且要设置两次:<param name="movie" value="test.swf" />和<object type="application/x-shockwave-flash" data="test.swf" width="300" height="120">

使用方法二:

1、在head区引入下面代码


<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
    swfobject.embedSWF("test.swf", "myContent", "300", "120", "9.0.0", "expressInstall.swf");
</script>


2、在你想插入的地方放个div,ID就叫"myContent"。如下:

<div id="myContent">
    <h1>Alternative content</h1>
    <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.5imoban.net/uploads/allimg/140107/10030641b-0.gif" alt="Get Adobe Flash player" /></a></p>
</div>

注:swfobject.embedSWF("test.swf", "myContent", "300", "120", "9.0.0", "expressInstall.swf");参数“test.swf”为你要引入的flash,“myContent”为你DIV的ID,“expressInstall.swf”为下载的插件里的flash。


官方网址:http://blog.deconcept.com/swfobject/

下载地址:http://www.5imoban.net/download/flash/20140107/swfobject_2_2.zip