IE6에서 셀렉트박스가 z-index에 무관하게 최상위로 보이는 현상

<!--[if lte IE 6.0]>
<script type="text/javascript">
function selectFix(divID) {
	var tar = document.getElementById(divID);
	var tarWidth = tar.offsetWidth;
	var tarHeight = tar.offsetHeight;
	var tarTop = tar.offsetTop;
	var tarLeft = tar.offsetLeft;

	var coverID = divID + "_cover";

	if (document.getElementById(coverID)) return false;

	var cover = document.createElement("iframe");
	tar.parentNode.insertBefore(cover,tar);
	cover.setAttribute("id",coverID);

	if (!document.getElementById(coverID)) return false;
	var obj = document.getElementById(coverID);
	obj.setAttribute("frameborder",0);
	obj.style.position = "absolute";
	obj.style.top = tarTop + "px";
	obj.style.left = tarLeft + "px";
	obj.style.width = tarWidth + "px";
	obj.style.height = tarHeight + "px";
}
function removeSelectFix(divID) {
	var tar = document.getElementById(divID);
	var obj = document.getElementById(divID + "_cover");
	if (!obj) return false;
	tar.parentNode.removeChild(obj);
}
</script>
<![endif]-->

조건부 주석으로 IE6에서만 적용되도록 감쌌음.

아래의 사용법

<script type="text/javascript">
function showPopup() {
	document.getElementById("popup").style.display = "";
	try{
		if(selectFix) {
			selectFix("popup");
		}
	}catch(aa){}

}
function hidePopup() {
	document.getElementById("popup").style.display = "none";
	try{
		if(removeSelectFix) {
			removeSelectFix("popup");
		}
	}catch(aa){}
}
</script>

레이어등이 보이는경우 – showPopup();에 selectFix(layerID)를 추가해 주고,
레이어를 없앨경우 – hidePopup(); 에 removeSelectFix(layerID)를 추가함.

• select를 단순 박스형태로 덮는경우에 사용 가능
• 동적으로 움직이는 레이어나 box형태가 아닌 레이어에 대해 iframe의 한계가 있음.
• 투명한 플래쉬일 경우 역시 iframe의 한계가 있음.

미리보기