상세 컨텐츠

본문 제목

[펌] IE에서 SelectBox가 레이어를 가리는 문제를 피하는 방법

프로그래밍/스크립트

by 라제폰 2009. 2. 6. 16:59

본문

IFRAME 을 사용하는 방법이나, OBJECT 테그를 사용하는 방법등 이미 여러가지 방법이 소개되었지만, IE에서 SelectBox가 레이어를 가리는 문제를 근본적으로 피하기는 힘들어보입니다.
제가 소개해드리는 아이디어는, SelectBox를 어떤 다른것으로 가리는것이 아니라, 레이어가 SelectBox위에 올라갈때만 잠깐 없애주는 것으로,
기존의 스크립트에 아래의 두가지 메소드를 레이어가 생성될때 hideControl(), 레이어가 사라질때 showControl() 메소드를 추가해주는 것 만으로도 해결할 수 있습니다.

    hideControl (tagName, popupObj)
    showControl(popupObj)

첫번째와 두번째의 예시를 각각 테스트해한 후 비교해보시기 바랍니다.













<script language="JavaScript">
<!--

function hideControl (tagName, popupObj)
{
    if (document.all) {

        var x = cmGetX (popupObj);
        var y = cmGetY (popupObj);
        var w = popupObj.offsetWidth;
        var h = popupObj.offsetHeight;

        var i;
        for (i = 0; i < document.all.tags(tagName).length; ++i) {
            var obj = document.all.tags(tagName)[i];
            if (!obj || !obj.offsetParent) continue;

            var ox = cmGetX (obj);
            var oy = cmGetY (obj);
            var ow = obj.offsetWidth;
            var oh = obj.offsetHeight;

            if (ox > (x + w) || (ox + ow) < x) continue;
            if (oy > (y + h) || (oy + oh) < y) continue;
            
            if(obj.style.visibility == "hidden") continue;

            if(!popupObj.overFlag)
                popupObj.overFlag = new Array ();

            popupObj.overFlag[popupObj.overFlag.length] = obj;
            obj.style.visibility = "hidden";
        }
    }

}

function showControl(popupObj)
{
    if (popupObj.overFlag) {
        var i;
        for (i = 0; i < popupObj.overFlag.length; ++i)
            popupObj.overFlag[i].style.visibility = "";
    }
    popupObj.overFlag = null;
}

function cmGetX (obj)
{
    var x = 0;
    do
    {
        x += obj.offsetLeft;
        obj = obj.offsetParent;
    }
    while (obj);
    return x;
}

function cmGetY (obj)
{
    var y = 0;
    do
    {
        y += obj.offsetTop;
        obj = obj.offsetParent;
    }
    while (obj);
    return y;
}

//-->
</script>

관련글 더보기