解決Flash擋住層用z-index無效的問題


有時我們要用flash做透明背景結果發現加好之后下面的文字連接點擊不了了,div下拉也給flash檔住了,后來百度發現我們只要設置wmode參數就可解決了。
 

在HTML中,如果嵌入Flash,默認會將flash放在頁面的最上面。也就是說,即使用絕對定位,將z-index設的無窮高,頁面里的任何元素還是無法將它蓋住。這時候,有兩種方法可以控制flash的z-index

1、在嵌入flash時,設置flash的wmode參數為opaque
2、在嵌入flash時,設置flash的wmode參數為transparent

對應的IE和FireFox的代碼如下所示,

發現ie和FF加該參數的方式不同,遂針對處理了一下,這下都可以了。

讓Flash不檔住浮動對象或層的關鍵參數:wmode=opaque

方法:

針對IE 在<object></object>內加上參數<param name="wmode" value="opaque" />
針對FF 在<embed />內加上參數wmode="opaque"


方法一:

在網頁中插入flash的代碼如下:

 代碼如下 復制代碼

<object type=”application/x-shockwave-flash” data=”style/flash/001.swf” width=”400″ height=”400″> <param name=”movie” value=“001.swf” /> <param name=”wmode” value=”opaque” /> <embed wmode=”opaque”></embed> </object> 

其中param有個name為wmode的屬性,只要將其設置為opaque, 並確保包含<embed wmode=”opaque”></embed>即可。

注:代碼中必須包含上代碼中的2、3行。


方法二:設置透明的Flash

本方法是設置flash透明來達到所需的效果。具體做法是 將上代碼中的name為wmode的屬性設置為transparent, 即代碼:<param name=”wmode” value=”transparent”>

原因:

flash嵌入的時候有幾種模式:


1、窗口(window)
默認情況下的顯示模式。在這種模式下flash player有自己的窗口句柄,這就意味着flash影片是存在於Windows中的一個顯示實例,並且是在瀏覽器核心顯示窗口之上的,所以flash只 是貌似顯示在瀏覽器中,但這也是flash最快最有效率的渲染模式。由於他是獨立於瀏覽器的HTML渲染表面,這就導致默認顯示方式下flash總是會遮 住位置與他重合的所有DHTML層。但是大多數蘋果電腦瀏覽器會允許DHTML層顯示在flash之上,但當flash影片播放時會出現比較詭異的現象,比如DHTML層像被flash刮掉一塊一樣顯示異常。

2、不透明無窗口(opaque)

這是一種無窗口模式,在這種情況下flash player沒有自己的窗口句柄,這就需要瀏覽器需要告訴flash player在瀏覽器的渲染表面繪制的時間和位置。這時flash影片就不會在高於瀏覽器HTML渲染表面而是與其他元素一樣在同一個頁面上,因此你就可以使用z-index值來控制DHTML元素是遮蓋flash或者被遮蓋。
3、透明無窗口(transparent)


透明模式,在這種模式下flash player會將stage的背景色alpha值將為0並且只會繪制stage上真實可見的對象,同樣你也可以使用z-index來控制flash影片的 深度值,但是與opaque模式不同的是這樣做會降低flash影片的回放效果,而且在9.0.115之前的flash player版本設置wmode=”opaque”或”transparent”會導致全屏模式失效。

這三種模式分別表示着Flash在頁面中的三種表現形式,根據這三種表現形式,我們就找到了解決這個問題的方法,就是將頁面中的Flash模式 (wmode)設置為不透明無窗口(opaque)或者是透明無窗口(transparent),在這兩種模式下頁面中的Flash將與HTML結構是處 於同一級別的,所以就可以通過z-index來控制頁面中的重疊部分到底是Flash顯示在上還是HTML結構顯示在上。

當我們需要在頁面中加載一個彈出Flash廣告時,並且不希望它被頁面中的其它Flash所遮擋時,就可以使用這種方法來解決。同樣的如果這個彈出 Flash是不規則形狀的時候,就可以將模式(wmode)設置為透明無窗口(transparent),這樣即可以除去Flash本身所帶有的背景。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM