在WEB標準中嵌入Flash的最佳方法_Div+CSS教程

教程Tag：暫無Tag,歡迎添加,賺取U幣!

Flash 嵌入的問題論壇中有人問了好多次，到底應該怎么用，為什么通不過驗證，要通過驗證怎么辦等等等。
討論中也出現了不少的誤解，所以我單開一個帖總結一下我所知道的東西，不想看我羅嗦的直接跳到最后看結論就可以了。

一、傳統的方法。
<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>
這方法是使用 object 和 embed 標簽來嵌入，細心的會發現，object 的很多參數和 embed 里面的很多屬性是重復的，為什么這樣做？為了瀏覽器兼容性，有的瀏覽器支持 object，有的支持 embed，這也是為什么要修改 Flash 的參數時兩個地方都要改的原因。這種方法是 Macromedia 一直以來的官方方法，最大限度的保證了 Flash 的功能，沒有兼容性問題。但是它現在不那么好用了：

無法通過驗證，由于為了兼容性而嵌入的 embed 標簽是不符合 W3C 的規范的。當然，假如你不在乎什么規范不規范，另當別論。
微軟由于種種原因，在 sp2 后限制了 IE 的 ActiveX 的使用模式，就是在頁面中的 ActiveX 有一個虛框，需要用戶點擊一次才能正常交互。Flash是作為一個 ActiveX 嵌入到網頁中的，所以它也會受牽連，只有通過 JS 嵌入 Flash 才能解決這個問題。
沒有 Flash 版本檢測，假如版本瀏覽器的flash插件版本不夠，或者不能正常顯示你的 swf 文件，或者會彈出一個 ActiveX 的確認安裝的框——這個框對很多用戶來說是很恐怖的。

二、只用 object 的方法，這種方法的名字叫做 Flash satay，最早是2002年由 Drew McLellan 發表在 A List Apart 上，后來又經過了幾次完善：
<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>
這方法沒 embed 了，可以通過驗證，是標準的嵌入 Flash 的方法，瀏覽器兼容性也不錯，看起來幾乎完美，不過還是有問題的：

需要一個 holder swf 來加載你的目標 swf 以保證 IE 中的 stream 能力，假如你需要通過 flashvars 來傳參，或者和頁面的 JS 交互，會很麻煩。
同上面第二點，ActiveX的虛框問題。
繼續同上沒有版本檢測
還是有少數用戶代理（比如一些版本的 safari 和一些屏幕閱讀器）不認這種方式，有 bug。

三、用JS嵌入的方法。
用JS嵌入就是各有各的嵌入方法了，有嵌得好的有嵌得不好的。有人用 document.write 直接寫，這法子說實話不大好，感覺 hack 成分多了，有點為了驗證而驗證的意思，而且沒有體現出什么 JS 的優勢。我覺得一個好的 JS 嵌入腳本，在保證 Flash 應有功能的基礎上，要發揮 JS 的優勢應該要有版本檢測，要能很好解決可訪問性問題（也就是用戶在無法瀏覽 Flash 內容或禁用 JS 的時候應該如何處理的問題），要易于重復使用。
我知道的比較常見的 JS 嵌入方法有以下幾個

SWFObject
UFO - Unobtrusive Flash Objects
Macomedia（現在是Adobe了..）提供的腳本[這里]和[這里]。

我 SWFObject 用的比較多，就挑它來說一些這種方法的優點：

IE中沒有討厭的虛框問題了。
提供了完善的版本檢測功能，假如版本不夠則顯示其他東西，比如圖片或文字。
易于使用，只要在頁面頭加載一個 .js 文件，然后 HTML 寫一個容器，里面放普通的文本或圖片（用于無法顯示 Flash 時顯示），最后用腳本來替換這個元素里面的內容為 Flash。
可以通過驗證——當然這個不是重點，只是順帶效果罷了。

四、我的結論。
現階段用 JS 嵌入 Flash 是最完美的方法，雖然這法子這也是由于瀏覽器的種種問題而作出的妥協。
但它在保證 Flash 功能的前提下還利用 JS 提供了額外的好處，再者又已經有人寫了很完善的嵌入腳本可以方面地下載使用（推薦 SWFObject），我們還有什么理由不用它呢？

SWFObject 那網頁是英文的，這里寫個簡單的用法教程：

下載它的.js文件，在這里： http://blog.deconcept.com/swfobject/swfobject1-4.zip （假如鏈接失效可能是版本有更新，請用上面給出的地址去主頁下載最新版本）
在你的 HTML 頁面頭部<head>區嵌入這個腳本文件：<script type="text/javascript" src="swfobject.js"></script>
在你的 HTML 中寫一個用來放 Flash 的容器，比如<div>，并隨便給一個 id 比如 flashcontent。然后在里面放上你的替換內容。
<div id="flashcontent">
這里放替換內容，用來在 Flash 無法顯示時顯示。
</div>
使用腳本替換這個內容：
<script type="text/javascript">
var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
//參數意思：地址，Flash 的 id（不是容器的 id），寬，高，版本需求，背景顏色
//這是最基本的，假如你要高級的設置，就仔細翻翻說明吧。
so.write("flashcontent");
</script>
這腳本可以寫在 HTML 中也可以寫在外部 .js 文件中。
OK