IE6、IE7絕對定位與鏈接問題研究_DIV+CSS實例
教程Tag:暫無Tag,歡迎添加,賺取U幣!
今天做了FLASH上加入一個鏈接的效果,通常情況下這種事應(yīng)該改一下FLASH原文件就可以,但在非凡情況下需要我們加入一個層然后加入一個鏈接的方法實現(xiàn)。
先簡單說一下實現(xiàn)這種效果的一般方法:
建好一個塊模型DIV,然后放入兩個子元素DIV,一個用來放FLASH,另一個用來放那個層(層內(nèi)有一個鏈接用來點擊,并且點擊面積與FLASH相同)點擊層我們用絕對定位的方法,在層內(nèi)的那個鏈接要放入一個透明的GIF,或PNG圖寫入寬度,高度與FLASH同。父元素DIV記得加入相對定位。
FLASH中的處理是:
<param name="wmode" value="transparent">(FOR IE)
<embed wmode="transparent" ...>(FOR FF)
示例:(注重!些代碼省去了不相關(guān)的FLASH代碼,實際應(yīng)用中要加完整代碼)
示例代碼 [m.dounai2.com]
<div style="position:relative;">
<div style="position:absolute;left:0; top:0; width:450px; height:400px; display:block; z-index:2;"><a href="#"><img src="space.gif" /></a></div>
<object>
<param name="wmode" value="transparent">
<embed wmode="transparent">...<embed>
</object>
</div>
<div style="position:absolute;left:0; top:0; width:450px; height:400px; display:block; z-index:2;"><a href="#"><img src="space.gif" /></a></div>
<object>
<param name="wmode" value="transparent">
<embed wmode="transparent">...<embed>
</object>
</div>
但我們一般會想為什么不直接定義A為塊元素,設(shè)置高與寬不得可以了嗎?但事實IE并不能如你所愿,假如這么定義了樣式,在FF中是可以的(Opera做的事與和IE一樣),發(fā)現(xiàn)假如定義了A的背景色的情況下A的塊效果是有效的,但假如定義為透明仍然沒有效果。最后只好做罷,使用透明圖片好了!
相關(guān)DIV+CSS實例:
- 固定div容器的寬高,圖片居中(圖片不限制大小)
- 用css制作有滾動條的居中彈出框
- 鼠標(biāo)指住(hover)變色的按鈕演示demo
- 10個很酷的涂鴉風(fēng)格國外網(wǎng)店設(shè)計展示
- jquery模擬瀏覽器滾動條效果
- 仿谷歌google的搜索框下拉提示列表效果
- JS顯示網(wǎng)頁最后更新時間
- CSS技巧:text-indent隱藏文字(以圖換字)
- CSS實例:三列自適應(yīng)等高且中列寬度自適應(yīng)
- DivCSS布局實例:很實用的圖文混排CSS列表-富有語義
- DivCSS實例:CSS菜單Flash效果用圖片模擬實現(xiàn)
- DivCSS布局實例用dldtdd來制作列表
DIV+CSS實例Rss訂閱Div+Css教程搜索
DIV+CSS實例推薦
- 用“ul li”及css制作韓國風(fēng)格菜單
- CSS基礎(chǔ)實例:CSS實現(xiàn)帶背景圖片的文字鏈接的方法
- DIV CSS JS仿kijiji導(dǎo)航條
- CSS實例:三列自適應(yīng)等高且中列寬度自適應(yīng)
- 用css網(wǎng)站布局之十步實錄!(十)
- CSS實例:Unobtrusive頁簽切換符合Web標(biāo)準(zhǔn)具有html語義
- CSS實例:非常不錯的鼠標(biāo)懸停TIP效果!
- HowCSSLayoutWorks-如何進行CSS布局
- DIVCSS圖形菜單之仿DreamWeaver
- CSS實例教程:UL制作CSS橫向菜單藍(lán)綠色調(diào)
猜你也喜歡看這些
- 相關(guān)鏈接:
- 教程說明:
DIV+CSS實例-IE6、IE7絕對定位與鏈接問題研究。