SWFObject Flash js調(diào)用類
更新時(shí)間:2008年07月08日 10:24:49 作者:
一直想為 SWFObject 這個(gè)JS的類庫寫一個(gè)推薦帖,因?yàn)樗p便,同時(shí)功能強(qiáng)大,為我們的開發(fā)帶來了很大的便捷。
SWFObject是一個(gè)基于Javascript的Flash媒體版本檢測(cè)與嵌入模塊,其主要使用目的是讓我們將FLASH嵌入網(wǎng)頁中的操作更簡(jiǎn)單,加入了版本檢測(cè)功能,符合XHTML的標(biāo)準(zhǔn)驗(yàn)證的插入,并解除了IE對(duì)FLASH點(diǎn)擊激活的限制,對(duì)主流瀏覽器兼容。
首先讓我們看一段SWFObject作用的代碼:
//載入SWFObject類庫
<script type="text/javascript" src="swfobject.js" src="swfobject.js"></script>
//設(shè)置一個(gè)DIV,并設(shè)置ID,這個(gè)DIV將做為FLASH插入的容器
<div id="flashcontent">播放此動(dòng)畫需要FlashPlayre8.0+ </div>
//利用SWFObject來插入FLASH
<script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
//將id為flashcontent的DIV中內(nèi)容替換為FLASH
so.write("flashcontent");
</script>
看了上面的代碼感覺如何?比起平時(shí)用Object來插入FLASH文件是不是簡(jiǎn)潔多了,而且代碼結(jié)構(gòu)更清晰,對(duì)這段代碼的中文解釋可參看AW對(duì)SWFObject的翻譯,已經(jīng)很詳細(xì)了,不再贅述,下面只介紹一下個(gè)人認(rèn)為最實(shí)用的功能。
一、版本檢測(cè)
難免存在播放器版本過低的用戶,而且他們大多數(shù)是低端用戶,對(duì)電腦知識(shí)了解較淺,如果他們看不到我們所指出的FLASH動(dòng)畫,或者是由于播放器版本不支持新版本中的某些特性,用戶看到的是殘缺的動(dòng)畫,那么這就是一個(gè)糟糕的用戶體驗(yàn),用戶很容易將一切因素都?xì)w咎于產(chǎn)品的開發(fā)者。實(shí)用SWFObject就可以很好的避免這一麻煩,當(dāng)它檢測(cè)到用戶的播放器版本低于我們?cè)O(shè)置的版本時(shí),F(xiàn)LASH不會(huì)替換DIV容器中的內(nèi)容,因此我們可以在這里給用戶提示,例如:“你需要升級(jí)FLASH播放器版本至8.0+”。如果條件允許,我們可以在這里給用戶一個(gè)Adobe的FlashPlayer的升級(jí)鏈接或者直接提供一個(gè)Active安裝包給用戶下載安裝。
二、對(duì)FlashVars的支持
so.addVariable("arg1","test1"));
so.addVariable("arg2","test2"));
上面兩句代碼將以FlashVars的方式給FLASH的ROOT中添加兩個(gè)變量arg1=test1,arg2=test2,簡(jiǎn)潔,方便,同時(shí)不用我們?cè)倏紤]IE和FF的兼容問題。
注意:JS跟FLASH通信是以字符串傳遞的,因此對(duì)于Number型變量FLASH端需要做類型轉(zhuǎn)換。
三、設(shè)置FLASH內(nèi)聯(lián)參數(shù)
so.addParam("wmode", "transparent");
這是我們很熟悉的設(shè)置FLASH背景透明的代碼,其他內(nèi)聯(lián)屬性可以嘗試設(shè)置一下。
四、獲取URL中的變量
對(duì)于url?arg1=test1&arg2=test2這樣用GET方式傳遞變量的URL,我們可以用getQueryParamValue方法來獲取變量。
var t1 = getQueryParamValue("arg1");
alert(t1);
官方地址:http://blog.deconcept.com/swfobject/
首先讓我們看一段SWFObject作用的代碼:
//載入SWFObject類庫
<script type="text/javascript" src="swfobject.js" src="swfobject.js"></script>
//設(shè)置一個(gè)DIV,并設(shè)置ID,這個(gè)DIV將做為FLASH插入的容器
<div id="flashcontent">播放此動(dòng)畫需要FlashPlayre8.0+ </div>
//利用SWFObject來插入FLASH
<script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
//將id為flashcontent的DIV中內(nèi)容替換為FLASH
so.write("flashcontent");
</script>
看了上面的代碼感覺如何?比起平時(shí)用Object來插入FLASH文件是不是簡(jiǎn)潔多了,而且代碼結(jié)構(gòu)更清晰,對(duì)這段代碼的中文解釋可參看AW對(duì)SWFObject的翻譯,已經(jīng)很詳細(xì)了,不再贅述,下面只介紹一下個(gè)人認(rèn)為最實(shí)用的功能。
一、版本檢測(cè)
難免存在播放器版本過低的用戶,而且他們大多數(shù)是低端用戶,對(duì)電腦知識(shí)了解較淺,如果他們看不到我們所指出的FLASH動(dòng)畫,或者是由于播放器版本不支持新版本中的某些特性,用戶看到的是殘缺的動(dòng)畫,那么這就是一個(gè)糟糕的用戶體驗(yàn),用戶很容易將一切因素都?xì)w咎于產(chǎn)品的開發(fā)者。實(shí)用SWFObject就可以很好的避免這一麻煩,當(dāng)它檢測(cè)到用戶的播放器版本低于我們?cè)O(shè)置的版本時(shí),F(xiàn)LASH不會(huì)替換DIV容器中的內(nèi)容,因此我們可以在這里給用戶提示,例如:“你需要升級(jí)FLASH播放器版本至8.0+”。如果條件允許,我們可以在這里給用戶一個(gè)Adobe的FlashPlayer的升級(jí)鏈接或者直接提供一個(gè)Active安裝包給用戶下載安裝。
二、對(duì)FlashVars的支持
so.addVariable("arg1","test1"));
so.addVariable("arg2","test2"));
上面兩句代碼將以FlashVars的方式給FLASH的ROOT中添加兩個(gè)變量arg1=test1,arg2=test2,簡(jiǎn)潔,方便,同時(shí)不用我們?cè)倏紤]IE和FF的兼容問題。
注意:JS跟FLASH通信是以字符串傳遞的,因此對(duì)于Number型變量FLASH端需要做類型轉(zhuǎn)換。
三、設(shè)置FLASH內(nèi)聯(lián)參數(shù)
so.addParam("wmode", "transparent");
這是我們很熟悉的設(shè)置FLASH背景透明的代碼,其他內(nèi)聯(lián)屬性可以嘗試設(shè)置一下。
四、獲取URL中的變量
對(duì)于url?arg1=test1&arg2=test2這樣用GET方式傳遞變量的URL,我們可以用getQueryParamValue方法來獲取變量。
var t1 = getQueryParamValue("arg1");
alert(t1);
官方地址:http://blog.deconcept.com/swfobject/
您可能感興趣的文章:
- JS+FLASH幻燈片播放圖片腳本,整理了代碼,使得調(diào)用更加方便!
- 可以媲美Flash的JS導(dǎo)航菜單
- 用js實(shí)現(xiàn)的一個(gè)Flash滾動(dòng)輪換顯示圖片代碼生成器
- 用javascript實(shí)現(xiàn)的仿Flash廣告圖片輪換效果
- flash與js通訊方法
- 比較簡(jiǎn)單的一個(gè)符合web標(biāo)準(zhǔn)的JS調(diào)用flash方法
- 純js無flash仿搜狐女人頻道FLASH圖片切換效果代碼
- Javascript 判斷Flash是否加載完成的代碼
- JS仿flash上傳頭像效果實(shí)現(xiàn)代碼
- JavaScript仿flash遮罩動(dòng)畫效果
相關(guān)文章
全面解析Bootstrap中tooltip、popover的使用方法
這篇文章主要為大家詳細(xì)解析了Bootstrap中tooltip、popover的使用方法,了解提示框、彈出框的實(shí)現(xiàn)原理,感興趣的朋友可以參考一下2016-06-06
JavaScript 函數(shù)式編程實(shí)踐(來自IBM)
說到函數(shù)式編程,人們的第一印象往往是其學(xué)院派,晦澀難懂,大概只有那些蓬頭散發(fā),不修邊幅,甚至有些神經(jīng)質(zhì)的大學(xué)教授們才會(huì)用的編程方式。
2010-06-06
前端echarts tooltip展示多項(xiàng)自定義數(shù)據(jù)代碼示例
Echarts是一個(gè)基于JavaScript的開源圖表庫,提供了豐富的圖表類型,如折線圖、柱狀圖、餅圖、散點(diǎn)圖等,支持動(dòng)態(tài)數(shù)據(jù)交互和自定義配置,這篇文章主要給大家介紹了關(guān)于前端echarts tooltip展示多項(xiàng)自定義數(shù)據(jù)的相關(guān)資料,需要的朋友可以參考下
2024-09-09
快速解決FusionCharts聯(lián)動(dòng)的中文亂碼問題
這篇文章主要介紹了如何解決FusionCharts聯(lián)動(dòng)的中文亂碼問題。需要的朋友可以過來參考下,希望對(duì)大家有所幫助
2013-12-12
js改變img標(biāo)簽的src屬性在IE下沒反應(yīng)的解決方法
在Chrome FF里都能改變成功,但在IE下卻不行,網(wǎng)上搜了半天,大概了解了,這個(gè)是IE的一個(gè)bug,具體的解決方法如下,有類似問題的朋友可以參考下哈,希望對(duì)大家有所幫助
2013-07-07 
