bgiframe插件解決IE6 DIV檔不住下拉選擇框

2024-07-11 08:35:16

字體：大中小

來源：轉載

供稿：網友

bgiframe 插件用來輕松解決 IE6 z-index 的問題，如果網頁上有浮動區塊和下拉選單重疊時，在IE6會看到下拉選框總是把浮動區塊覆蓋住，無論怎么調整 z-index 都是沒用的，而用 bgiframe 就可以輕松解決這個問題。
使用方法：

$(document).ready(function() {
$(‘#floatingBox’).bgiframe();
});

DIV層遮罩效果原理：
使用一個比需要被遮罩的div層大一些的透明的另一個div層覆蓋掉需要被遮罩的div層
這樣就不能對底層 div里的內容進行操作了

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>無標題文檔</title>
</head>
<body>
<div id=”ly” style=”position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #777;
z-index: 2; left: 0px; display: block; width:500px;height:500px;”>
</div>
<div style=”width:400px;height:400px;z-index:1;border:red solid 1px;position:absolute;top:20px;left:20px;”><input type=”text” value=”ddd” /></div>
</body>
</html>