社群 學習 工具庫 休閒
搜尋
繁体中文
首頁 > web前端 > html教學 > html元素遮擋flash詳解範例_HTML/Xhtml_網頁製作

html元素遮擋flash詳解範例_HTML/Xhtml_網頁製作

WBOY
發布： 2016-05-16 16:38:11
原創
1458 人瀏覽過


複製程式碼
程式碼如下:

w可用z-index控制層級
opaque模式：可用z-index控制層級
window模式：flash層級在瀏覽器核心顯示視窗之上，flash會蓋住與他重合的html

情境1（可修改flash的wmode參數）

修改wmode屬性為，transparent或opaque

DEMO如下：

 


複製程式碼碼

HTML元素遮蔽Flash - 情境1 title><br> <style><br /> html, body, object, embed{ padding: 0; margin: 0; }<br /> .m-box { position: relative; } <p> .m-flash, .m-flash embed { width: 400px; }<br /> .m-shadow { position: absolute; top: 0; left: 0; width: 100px; height: 100-px; : #ccc; }<br /> </style> <br><br>



http://www.aa.net/i/bookmark.swf">

">http://www.aa.net/ i/bookmark.swf">>


Jununx，歡迎您！ --transparent




http://www.aa.net/i/bookmark .swf">

">http://www.aa.net/i/bookmark.swf">>


Jununx，歡迎您！ --opaque






情境2（不可修改flash的wmode參數）-- flash和你的iframe遮擋層在同一個頁面
註：如果要相容Safari、Opera，那麼請直接告訴需求這個遮不了

DEMO如下：

 




複製程式碼

程式碼如下:





HTML元素凸顯Flash - 場景2






http://www.aa.net/i/bookmark.swf">

http://www.aa.net/i/bookmark.swf">>


Jununx，歡迎您！ --window





場景3（不可修改flash的wmode參數）--flash是被一個iframe頁面引入的
註：如果木有權限操作iframe頁面，那麼請直接告訴需求這個不行註：如果要兼容Safari 、歌劇，那就請直接告訴需求這根本不行

DEMO頁：
 

複製程式碼
程式碼如下：

碼



HTML元素凸顯Flash - 場景2 title><br> <style><br /> html, body, object, embed{ padding: 0;保證金：0; }<br /> .m-box { 位置：相對; } <p> .m-flash { 位置：相對；寬度：400px；高度：400像素； z 索引：1； }<br /> .m-shadow { 位置：絕對；頂部：0；左：0； z 索引： 2；寬度：100px；高度：100px；背景顏色：#ccc; }<br /> .m-shadow-txt { 位置：絕對； z 索引：2; }<br /> .m-shadow-ifr { 位置：絕對； z 索引：-1；寬度：100%；高度：100%；不透明度：0；過濾器：阿爾法（不透明度=0）； }<br /> </style> <br><br>



Jununx，歡迎您！ --window





iframe頁：
 

複製程式碼
程式碼如下：





HTML元素凸顯Flash - 場景3
相關標籤：
html元素
來源：php.cn
上一篇：html頁面嵌套使用範例(frameset使用方法)_HTML/Xhtml_網頁製作 下一篇：html使用margin:0 auto整個頁面不居中的解決方法_HTML/Xhtml_網頁製作
本網站聲明
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
作者最新文章
最新問題
如何在 CSS 中使浮動元素垂直堆疊而不是水平堆疊？ 我正在嘗試製作一個包含兩列的網頁，一側具有主要內容，另一側具有額外的內容。但是因為我使用浮動屬性將額外的列向左對齊，所以它水平堆疊，但我希望它垂直堆疊。我目前的程式碼：.topic...
來自於 2024-04-06 20:45:26
0
2
386
無法從網站取得輸入元素 所以我試圖從Twitter獲取一個輸入元素，但當我運行它時，它不斷在節點終端中給我一個這樣的錯誤，結果，由此代碼創建的瀏覽器窗口將自行關閉，因為它找不到正確的輸入選擇器。如何取得正...
來自於 2024-04-06 18:59:57
0
1
442
用 HTML 程式碼（從陣列產生）取代字串的頂級方法 給定一個像這樣的字串...$htmlPattern="Usernameis:#name#andusercompanyis#company#";如何將子字串#na...
來自於 2024-04-06 17:40:41
0
2
410
React子元素無效（發現：具有鍵{clientVersion}的物件）。如果您想渲染一個子元素集合，請使用數組代替 我有一個多步驟表單，當我嘗試提交時會顯示此錯誤。但是，如果我以簡單的形式使用createOrganization調度，它就會起作用。是後端問題還是前端問題？我可能做錯了什麼？我希望...
來自於 2024-04-06 16:25:39
0
1
346
供應商特定偽元素上的 JavaScript 懸停事件 我有以下htmlinput標籤。 $("input[type='range']::-webkit-slider-thumb").on('hover',funct...
來自於 2024-04-06 15:35:24
0
1
274
相關專題
更多>
熱門推薦
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板