CSS中DIV彈出層問題解決方案
本文向大家描述一下DIV彈出層問題解決方案,主要有兩種解決方法,一種是關(guān)于如何讓png背景在IE6下透明,另一種是DIV彈出層時,層下內(nèi)容透過DIV彈出層顯示出來,解決方案是在DIV彈出層內(nèi)加iframe,DIV彈出層本身要加定位(position:relative/absolute),要強調(diào)的是iframe要加透明濾鏡。
DIV彈出層問題解決方案
本文給大家講解一下平常在做DIV彈出層遇到的問題解決方法,主要有兩種方式。下面請看:
一、關(guān)于如何讓png背景在IE6下透明
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,src='/images/myimg.png',sizingMethod='crop');
三個參數(shù)的具體含義如下:
◆enabled:可選項。布爾值(Boolean)。設(shè)置或檢索濾鏡是否激活。true|false
true:默認值。濾鏡激活。
false:濾鏡被禁止。
◆sizingMethod:可選項。字符串(String)。設(shè)置或檢索濾鏡作用的對象的圖片在對象容器邊界內(nèi)的顯示方式。
◆crop:剪切圖片以適應(yīng)對象尺寸。
image:默認值。增大或減小對象的尺寸邊界以適應(yīng)圖片的尺寸。
scale:縮放圖片以適應(yīng)對象的尺寸邊界。
src:必選項。字符串(String)。使用絕對或相對url地址指定背景圖像。假如忽略此參數(shù),濾鏡將不會作用。
寫CSS的時候?qū)⑿枰哟藀ng背景的鉤子針對IE6寫個hack,*.mydiv{filter:progid:...;background:none;},注意把hack寫在非hack的后面。
需要強調(diào)的是:要求png做背景透明時要固定放png背景的容器尺寸,不然會有很多神奇的現(xiàn)象出現(xiàn),在需要透明png背景時寫結(jié)構(gòu)要謹記這一點。
二、DIV彈出層時,層下內(nèi)容透過DIV彈出層顯示出來,解決方案是在DIV彈出層內(nèi)加iframe,DIV彈出層本身要加定位(position:relative/absolute),要強調(diào)的是iframe要加透明濾鏡,visibility是inherit
另外建議將width,height直接寫在iframe上,因為不同的DIV彈出層尺寸也是不同的。
大概結(jié)構(gòu)如下:
Code
- <style>
- iframe{
- z-index:-1;
- position:absolute;
- top:0px;
- left:0;
- border:0none;
- visibility:inherit;
- filter:Alpha(opacity=0);
- }
- </style>
- <divclassdivclass="popUp">
- iframestyle="width:100%;height:200px;"></iframe>
- <div>contentinpopuplayer</div>
- </div>
文章來自學IT網(wǎng):http://www.xueit.com/html/2009-12-31/36-817097565140.html
【編輯推薦】