swfobject.js嵌入flash媒体资源

2016-02-20 00:56 3 1 收藏

下面请跟着图老师小编一起来了解下swfobject.js嵌入flash媒体资源,精心挑选的内容希望大家喜欢,不要忘记点个赞哦!

【 tulaoshi.com - Web开发 】

SWFObject的使用是非常简单的,只需要包含 swfobject.js这个js文件,然后在DOM中插入一些简单的JS代码,就能嵌入Flash媒体资源了。

一、优点:

1、SWFObject 的灵活性非常好。完全可以事先写好HTML的其他部分,最后再回过头来添加Flash内容。这样可以确保在客户端没有Flash的情况下,用户不会一无所获;也可以确保针对搜索引擎,做了什么样的关键词优化。完全不用像以前那样担心客户端的各种状况;

2、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+,各种浏览器的后续版本也会继续支持;

3、SWFObject检测Flash播放器版本从3开始到最新的版本号,而且也消灭了IE中激活的麻烦;

4、SWFObject可以方便地检查版本细节,例如我们需要v.6.0 r65 (or 6,0,65,0) 来处理SWF资源,就可以添加如下代码:

var so = new SWFObject(movie.swf, mymovie, 200″, 100″, 6.0.65″, #336699″);

5、SWFObject的版本检测可以人工忽略。如果在特定环境下不希望SWFObject检测版本号,那么只需要传递一个参数在HTML页面中,就可以了。SWFObject可以捕获这个参数并且跳过检测,直接写入Flash嵌入代码到DOM中。用于忽略版本检测的变量名是detectflash,以下是一个例子:

a href=mypage.html?detectflash=falseBypass link/a

二、使用说明:

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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

详细说明:

⑴、div id=flashcontent[...]/div:

为SWF资源预留一个HTML结点。这个HTML结点内的所有内容都会在客户端被Flash资源替换,当客户端没有安装Flash播放器的时候,这些内容会显示出来。这一特色在SEO以及对用户体验方面非常有必要。

(2)、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需要的版本号,它可以详细到 ‘主版本号.小版本号.细节‘,例如:9.0.28。一般地,我们只需传入主版本即可,例如:9″。

background-color - Flash资源的背景色,16进制格式

此外,还有如下可选参数:

quality - 画面质量,默认为high;

xiRedirectUrl - 如果的Flash影片在弹出窗口中,或者希望用户在完成了ExpressInstall后重定向到其他地址,可以采用xiRedirectUrl属性,来自动完成这一步骤。例如:

script type=text/javascript

var so = new SWFObject(movie.swf, mymovie, 200″, 100″, 8″, #336699″);

so.useExpressInstall(’expressinstall.swf’);

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

so.setAttribute(’xiRedirectUrl’, ‘http://www.example.com/upgradefinished.html’); // must be the absolute URL to your site

so.write(flashcontent);

/script

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)


redirectUrl - 没有安装相应版本的播放器后自动跳转的目标地址;

detectKey - 这是当忽略检测时,SWFObject将去url地址中查找的变量,默认值为detectflash;


(3)、so.write(flashcontent):

将Flash资源应用到DOM里,在浏览器显示出来;

 

三、范例:

1、传入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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

这里可以看到Flash支持的内联参数列表:http://kb2.adobe.com/cps/127/tn_12701.html(adobe.com官方资源)


2、采用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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

这些变量将会保存在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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

getQueryParamValue()方法同样可以获取JavaScript的Location对象的hash值location.hash来与swf内部进行通信。


3、在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’);

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

so.write(flashcontent);

/script

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

可以安装一个低版本的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’);

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

so.setAttribute(’xiRedirectUrl’, ‘http://www.example.com/upgradefinished.html’); // must be the absolute URL to your site

so.write(flashcontent);

/script

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

来源:http://www.tulaoshi.com/n/20160220/1632866.html

延伸阅读
标签: Web开发
JS怎样知道Flash广告条被网友点击过? 1、Flash广告条不是我做的,它的链接是写在里面的。 2、我想统计这个Flash被网友点击了多少次。 它由三个JS组成,它是一个广告联盟网站,统计FLASH被点击的应用,可是我不会修改成我的应用,请大家帮看看,谢谢,我的点击统计是 count.asp 请问怎样写一个JS可以进行统计,谢谢 1.js ---------------...
标签: Web开发
经常在网页上看见复制本页网址,给你的朋友分享之类的话,点按钮,在IE下能复制成功,而在firefox和opera等其他浏览器就不行。 下面的例子使用js+flash(as)实现了在不同浏览器里复制的功能,这样做的好处就是规避了浏览器兼容的问题。也就是说支持firefox,IE,OPERA 怎样使用? 1.先下载这个FLASH文件:文章末尾处链接地址可...
标签: Web开发
其他插件改一下sID就行了  系统正在检测你的播放器版本... [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
许久没有动手写教程,因为觉得从技法到结构以及动画思维以及镜头感表现之前的分享都已经有较多讲解,再写难免有重复。但是单单发个成品出来分享也许还是会有同学关心一些制作过程和技巧,罗嗦就啰嗦吧,难得这个周末在家困着没事可干。
标签: Web开发
作者:马健 邮箱:stronghorse@tom.com 主页:http://stronghorse.yeah.net 版本:1.01 初始发布日期:2005.08.29 最后更新日期:2005.09.28 目录 一、前言 二、从E书或网页中获取文件的一般步骤 三、从E书或网页中获取链接进来的css文件 四、从E书或网页中获取链接进来的js文件 五、从E书或网页中获取Flash文件 六、从E书或网页中获取背景音乐...

经验教程

36

收藏

51
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部