Решение глюка когда плавающие дивы перекрываются селектами

[shadeofgrass]

Многие при верстке HTML-страниц встречаются с глюком, когда сквозь текст во всплывающих дивах просвечивают селекты с нижнего слоя. Вчера по работе реализовала функции, которые помогают бороться с этим багом.


Cоздается Iframe в виде подложки, контент у него пустой. Он точно такого же размера как всплывающий див, создает какбы подложку под него, и перекрывает не только select но и flash баннеры.

//Эта функция создает или возвращает слой, который является плавающей подложкой
function getIframeLayer(elementId) {
iframeId = elementId+"IframeLayer";
//проверяем, если такой слой уже есть, то не нужно создавать.
if ($(iframeId) == null) {
var iframeLayer = document.createElement("IFRAME");
iframeLayer.setAttribute("id", iframeId);
iframeLayer.setAttribute("scrolling", "no");
iframeLayer.setAttribute("frameborder", "0");
iframeLayer.setAttribute("src", "javascript:false");
iframeLayer.setAttribute("src", "http:\\www.ya.ru");
iframeLayer.setAttribute("style", "z-index:0;position:absolute;border:0;top:0;left:0;width:0;height:0");
document.body.appendChild(iframeLayer);
} else {
var iframeLayer = $(iframeId);
}
return iframeLayer;
}

//Перемещает слой и меняет его форму, выводит на нужный план
(здесь zIndex нужно поставить такой, чтобы он был немного меньше чем у дива который плавает сверху, но больше чем у дива с селектами)
function relocateIframeLayer(elementId,top,left,width,height) {
iframeId = elementId+"IframeLayer";
if ($(iframeId) == null) {
var iframeLayer = getIframeLayer(elementId);
} else {
var iframeLayer = $(iframeId);
}
iframeLayer.style.position = 'absolute';
iframeLayer.style.top = top;
iframeLayer.style.left = left;
iframeLayer.style.width = width;
iframeLayer.style.height = height;
iframeLayer.style.zIndex = 499;
}

//прячет слой - подложку. Необходимо ее вызвать при закрытии верхнего дива
function hideIframeLayer(elementId) {
//alert('hideCall');
iframeId = elementId+"IframeLayer";
if ($(iframeId) != null) {
var iframeLayer = $(iframeId);
iframeLayer.style.width = 0;
iframeLayer.style.height = 0;
iframeLayer.style.zIndex = 0;
}
}