Html 加载SWF(FLash)
时间：2010-10-14 来源：YoursLan
HTML 用JS 加载Flash
2009-04-02 10:00
|
原文地址 http://blog.deconcept.com/swfobject/ 使用SWFObject 类 实现原理[对于急切需要下载的用户点击这里直接观看JS代码] SWFObject的使用是非常简单的，只需要包含 swfobject.js这个js文件，然后在DOM中插入一些简单的JS代码，就能嵌入Flash媒体资源了。 下面是一个最简单的范例： <script type="text/javascript" src="swfobject.js"></script> <div id="flashcontent"> This text is replaced by the Flash movie.</div><script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699"); so.write("flashcontent");</script>
让我们看看这些代码是如何工作的 <div id="flashcontent">[...]</div> 首先，我们要为SWF资源预留一个HTML结点。这个HTML结点内的所有内容都会在客户端被Flash资源替换，当客户端没有安装Flash播放器的时候，这些内容会显示出来。这一特色在SEO以及对用户体验方面非常有必要。 var so = new SWFObject(swf, id, width, height, version, background-color [, quality, xiRedirectUrl, redirectUrl, detectKey]); 创建一个新的SWFObject实例，并且传入一下参数:
此外，还有如下可选参数:
so.write("flashcontent");
将Flash资源应用到DOM里，在浏览器显示出来。 细节SWFObject 的灵活性非常好。您完全可以事先写好HTML的其他部分，最后再回过头来添加Flash内容。这样可以确保在客户端没有Flash的情况下，用户不会一无所获；也可以确保针对搜索引擎，做了什么样的关键词优化。您完全不用像以前那样担心客户端的各种状况 SWFObject兼容当前各种主流浏览器，如：PC上的IE5/5.5/6, Netscape 7/8,Firefox, Mozilla, and Opera。Mac上的IE5.2, Safari, Firefox, Netscape 6/7, Mozilla, and Opera 7.5+，各种浏览器的后续版本也会继续支持 SWFObject检测Flash播放器版本从3开始到最新的版本号，而且也消灭了IE中“激活”的麻烦。这里有相关背景。 SWFObject可以方便地检查版本细节，例如我们需要v.6.0 r65 (or 6,0,65,0) 来处理SWF资源，就可以添加如下代码: var so = new SWFObject("movie.swf", "mymovie", "200", "100", "6.0.65", "#336699");
SWFObject的版本检测可以人工忽略。如果在特定环境下您不希望SWFObject检测版本号，那么只需要传递一个参数在HTML页面中，就可以了。SWFObject可以捕获这个参数并且跳过检测，直接写入Flash嵌入代码到DOM中。用于忽略版本检测的变量名是“detectflash”，以下是一个例子： <a href="mypage.html?detectflash=false">Bypass link</a> SWFObject 范例以上我们接触到的范例都最基础的，接下来我们列举一些其他功能，尤其是传入参数、变量这些使用频率较高的行为。 传入Flash内联参数的简单范例<script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100%", "7", "#336699"); so.addParam("quality", "low"); so.addParam("wmode", "transparent"); so.addParam("salign", "t"); so.write("flashcontent");</script>
这里可以看到Flash支持的内联参数列表：full list of the current parameters and their possible values（adobe.com官方资源） 采用"Flashvars"参数传入变量用Flashvars是在预加载Flash时传入数据的最佳做法，语法格式与GET变量串非常类似，如：variable1=value1&variable2=value2&variable3=value3SWFObject帮助您将这项工作变得更加明确化 <script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699"); so.addVariable("variable1", "value1"); so.addVariable("variable2", "value2"); so.addVariable("variable3", "value3"); so.write("flashcontent");</script>
这些变量将会保存在_root这个MovieClip对象里。 SWFObject还可以方便地直接从URL中接受参数传入Flash中，例如你有这样一个URL：http://www.example.com/page.html?variable1=value1&variable2=value2。采用getQueryParamValue()方法你就可以轻松获取这些参数，并将它们传入Flash，例如：
<script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699"); so.addVariable("variable1", getQueryParamValue("variable1")); so.addVariable("variable2", getQueryParamValue("variable2")); so.write("flashcontent");</script>
getQueryParamValue()方法同样可以获取JavaScript的Location对象的hash值“location.hash”来与swf内部进行通信。这里是一个采用SWFObject的应用程序，其中用到了location.hash对象：链接地址 在SWFObject中应用Express Install（利用官方自动升级接口）SWFObject全面支持AdobeFlash播放器的自动升级功能(从6.0.65起的FlashPlayer支持在swf内部自动升级!)，这样用户完全不用离开您的网页就能完成播放器的升级了。 首先，上传官方的expressinstall.swf到您的服务器上，然后使用useExpressInstall方法指定这个swf文件的地址就可以了，例如： <script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "8", "#336699"); so.useExpressInstall('expressinstall.swf'); so.write("flashcontent"); </script>
您可以安装一个低版本的Flash播放器然后访问这个页面看到效果 在SWFObject原文件压缩包中您可以找到具体的使用细节，您可以自己定制ExpressInstall的流程。 如果您的Flash影片在弹出窗口中，或者您希望用户在完成了ExpressInstall后重定向到其他地址，你可以采用xiRedirectUrl属性，来自动完成这一步骤。例如： <script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "8", "#336699"); so.useExpressInstall('expressinstall.swf'); so.setAttribute('xiRedirectUrl', 'http://www.example.com/upgradefinished.html'); // must be the absolute URL to your site so.write("flashcontent");</script>
独特优势 虽然是目前最常用的方法，但仍然有一些问题。
2) 仅采用Object标签 / Flash satay这种方法在2002年的A List Apart article出现之后开始大面积流行，这里有两个例子： '仅含Object标签' <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" width="300" height="120"> <param name="movie" value="http://www.macromedia.com/shockwave/download/triggerpages_mmcom/flash.swf"> <param name="quality" value="high"> <param name="bgcolor" value="#FFFFFF"> <!--[if !IE]> <--> <object data="http://www.macromedia.com/shockwave/download/triggerpages_mmcom/flash.swf" width="300" height="120" type="application/x-shockwave-flash"> <param name="quality" value="high"> <param name="bgcolor" value="#FFFFFF"> <param name="pluginurl" value="http://www.adobe.com/go/getflashplayer"> FAIL (the browser should render some flash content, not this). </object> <!--> <![endif]--></object> Flash satay <object type="application/x-shockwave-flashdata="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>
3) 'small flash movie on the index page' 检测方法这个方法会通过在首页放一个swf文件去访问$version 变量来返回版本信息。 问题在于：
4) Adobe官方 Flash Player Detection 模块Adobe官方这个模块非常不错，然而仍然有一些不足，它采用两种方法来检测
深入讨论在这里。 5) 用纯粹的JS来检测、嵌入这种方法看起来不错，但是仍然缺乏规范，而且消耗开发成本
|
相关阅读 更多 +
