(转)swfobject.js 详细解说

一直想对这个应用做个总结,今天偶然百度到这个效果,为此做个笔记。

用这个js的好处:

1.IE中没有讨厌的虚框问题了。
2.提供了完善的版本检测功能,如果版本不够则显示其他东西,比如图片或文字。
3.易于使用,只要在页面头加载一个 .js 文件,然后 HTML 写一个容器,里面放普通的文本或图片(用于无法显示 Flash 时显示),最后用脚本来替换这个元素里面的内容为 Flash。
4.使得插入Flash媒体资源尽量简捷、安全。而且它是非常符合搜索引擎优化的原则的。
5.能够避免HTML、XHTML中出现object、embed等非标准标签,从而符合更加标准。

只需要包含 swfobject.js这个js文件,然后在DOM中插入一些简单的JS代码,就能嵌入Flash媒体资源了。下面是一个最简单的范例:

<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
   var so = new SWFObject("movie.swf", "mymovie", "400", "100%", "8", "#336699");
   so.addParam("quality", "low");
   so.addParam("wmode", "transparent");
   so.addParam("salign", "t");
   so.addVariable("variable1", "value1");
   so.addVariable("variable2", "value2");
   so.addVariable("variable3", "value3");
   so.addVariable("variable1", getQueryParamValue("variable1"));
   so.addVariable("variable2", getQueryParamValue("variable2"));
   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实例,并且传入一下参数:

swf - SWF文件路径 
id - 您为这个SWF文件分配的id值,它将用于给embed与object标签设定name属性,以便于可以支持swliveconnect的功能,如动态传 入变量 
width - 宽度 
height - 高度 
version - FlashPlayer需要的版本号,它可以详细到 ‘主版本号.小版本号.细节‘,例如:"6.0.65"。一般地,我们只需传入主版本即可,例如:"6"。 
background-color - Flash资源的背景色,16进制格式 
此外,还有如下可选参数:

quality - 画面质量,默认为"high"。 
xiRedirectUrl - 详见ExpressInstall相关 
redirectUrl - 没有安装相应版本的播放器后自动跳转的目标地址 
detectKey - 这是当忽略检测时,SWFObject将去url地址中查找的变量,默认值为“detectflash”,后续有详细介绍 
so.write("flashcontent");将Flash资源应用到DOM里,在浏览器显示出来。

解释一下这些参数的作用:

var so = new SWFObject(swf, id, width, height, version, background-color [, quality, xiRedirectUrl, redirectUrl, detectKey]);         //这段是SWFObject必须的基本参数,所有SWFObject都必须包含的。
   so.addParam("Param1", "Param2");   //这里是给Flash添加内联参数,可以实现诸如背景透明之类的效果。依照需求添加就可以了,参数和emded/object标签是一样的代码,下同。
   so.addParam("Param3", "Param4");
   so.addParam("Param5", "Param6");
   so.addVariable("variable1", "value1");    //这里是给Flash添加FlashVar,这是以FlashVar的方式给Flash的Root添加变量,对于Number型变量在Flash端需要 做类型转换。
   so.addVariable("variable2", "value2");
   so.addVariable("variable3", "value3");
   so.addVariable("variable1", getQueryParamValue("variable1"));   //Flash获取URL变量对于url?arg1=test1&arg2=test2这样用GET方式传递变量的URL,我们可以用 getQueryParamValue方法来获取变量。
   so.addVariable("variable2", getQueryParamValue("variable2"));
   so.write("content");    //这里是至关重要的一个地方,他是用一段特定内容取代Flash无法显示时的内容。可以事先在CSS里定义好样式,在文档里使用div标签写出来。这里 在调用过来。

时间: 2024-10-10 05:42:11

(转)swfobject.js 详细解说的相关文章

swfobject.js 详细解说

一直想对这个应用做个总结,今天偶然百度到这个效果,为此做个笔记. 用这个js的好处: 1.IE中没有讨厌的虚框问题了.2.提供了完善的版本检测功能,如果版本不够则显示其他东西,比如图片或文字.3.易于使用,只要在页面头加载一个 .js 文件,然后 HTML 写一个容器,里面放普通的文本或图片(用于无法显示 Flash 时显示),最后用脚本来替换这个元素里面的内容为 Flash.4.使得插入Flash媒体资源尽量简捷.安全.而且它是非常符合搜索引擎优化的原则的.5.能够避免HTML.XHTML中出

swfobject.js视频播放插件

在网页中经常会用到视频播放的功能,下面介绍一下swfobject.js的视频播放应用:html代码结构: <div id="video_content"></div> css样式结构: body{background: #003368} #video_content{width:600px;height:400px;margin:200px auto;} js代码: function showFLV(flvId,flvUrl,imgUrl,w,h){ var i

swfobject.js的简单配置

因为工作需要在网页中迁入flash,开发过程中,发现直接使用embed自己开发的话需要考虑各种兼容性,也比较麻烦, 网上也找了几个相关的插件,比较使用之下,发现swfobject.js这一款还是蛮不错的,这里我使用的是1.5版本,属于老版本, 所以和新版本的配置上有一些出入. 另外官方给出的说法是1.5升级高版本会有很多改动的地方,所以建议一开始就确定好使用的版本,尽量避免中途升级版本. 代码如下:注释比较全,不再单独解释了 <html> <head> <script src

比较好的播放视频插件swfobject.js

播放视频的方法: 方法一. 使用html5播放 <video src="./files/Clip_480_5sec_6mbps_h264.mp4" width="1000px" height="400px" controls="controls" loop="loop" autoplay="autoplay" poster="images/zzsm.png" s

使用 SWFObject.js 插入Flash

今天学习了一下使用 SWFObject.js 这个js插入flash. 下载地址:http://code.google.com/p/swfobject/ 这个js的好处 1.IE中没有讨厌的虚框问题了. 2.提供了完善的版本检测功能,如果版本不够则显示其他东西,比如图片或文字. 3.易于使用,只要在页面头加载一个 .js 文件,然后 HTML 写一个容器,里面放普通的文本或图片(用于无法显示 Flash 时显示),最后用脚本来替换这个元素里面的内容为 Flash. 4.使得插入Flash媒体资源

swfobject.js IE兼容问题

错误代码 在562行左右 / add style rule if (ua.ie && ua.win) { if (dynamicStylesheet && typeof dynamicStylesheet.addRule == OBJECT) { //插入一条 样式表的样式 ,是这个意思 dynamicStylesheet.addRule(sel, decl); //这一条语句导致之后的代码无法执行 ,解决办法:注释掉即可 } }

JS AS交互 在html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!-- saved from url=(0014)about:internet --> <html xmlns="http://www.w3.org/1999/xhtml"

调用MyReport实现js直接打印

生成MyReport打印控件 打开Flash Builder添加一个应用,命名为MyReportPrintApp. 封装myreport的打印方法让外部js能够访问,MyReportPrintApp.mxml代码如下: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:myr

[ActionScript 3.0] 与js通信

AS3代码,可做文档类; 1 package { 2 import flash.display.Sprite; 3 import flash.events.*; 4 import flash.external.ExternalInterface; 5 import flash.text.TextField; 6 import flash.utils.Timer; 7 import flash.text.TextFieldType; 8 import flash.text.TextFieldAut