[Html] 레이어 고정
  
 작성자 :
작성일 : 2007-11-23     조회 : 32,470  

<!--- 슬라이드메뉴 메뉴 1--------->
<div id="divMenu" style="Z-INDEX:1;LEFT:expression(((document.body.clientWidth-1000)+Math.abs(document.body.clientWidth-1000))/4+1030); TOP:30px; POSITION:absolute; ">

  <table width="100" cellpadding="0" cellspacing="0" bgcolor="red" height="200">
    <tr>
        <td width="1512" height="200">&nbsp;</td>
    </tr>
</table>
</div>
 

<!--- 슬라이드메뉴 2 -------->
<script language=javascript>
<!--
var bNetscape4plus = (navigator.appName == "Netscape" && navigator.appVersion.substring(0,1) >= "4");
var bExplorer4plus = (navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion.substring(0,1) >= "4");
function CheckUIElements(){
        var yMenuFrom, yMenuTo, yButtonFrom, yButtonTo, yOffset, timeoutNextCheck;

        if ( bNetscape4plus ) {
                yMenuFrom  = document["divMenu"].top;
                yMenuTo    = top.pageYOffset + 62;
        }
        else if ( bExplorer4plus ) {
                yMenuFrom  = parseInt (divMenu.style.top, 10);
                yMenuTo    = document.body.scrollTop + 200;
        }

        timeoutNextCheck = 500;

        if ( Math.abs (yButtonFrom - (yMenuTo + 140)) < 6 && yButtonTo < yButtonFrom ) {
                setTimeout ("CheckUIElements()", timeoutNextCheck);
                return;
        }

        if ( yButtonFrom != yButtonTo ) {
                yOffset = Math.ceil( Math.abs( yButtonTo - yButtonFrom ) / 10 );
                if ( yButtonTo < yButtonFrom )
                        yOffset = -yOffset;

                if ( bNetscape4plus )
                        document["divLinkButton"].top += yOffset;
                else if ( bExplorer4plus )
                        divLinkButton.style.top = parseInt (divLinkButton.style.top, 10) + yOffset;

                timeoutNextCheck = 10;
        }
        if ( yMenuFrom != yMenuTo ) {
                yOffset = Math.ceil( Math.abs( yMenuTo - yMenuFrom ) / 20 );
                if ( yMenuTo < yMenuFrom )
                        yOffset = -yOffset;

                if ( bNetscape4plus )
                        document["divMenu"].top += yOffset;
                else if ( bExplorer4plus )
                        divMenu.style.top = parseInt (divMenu.style.top, 10) + yOffset;


                timeoutNextCheck = 10;
        }

        setTimeout ("CheckUIElements()", timeoutNextCheck);
}

function OnLoad()
{
        var y;
        if ( top.frames.length )
        if ( bNetscape4plus ) {
                document["divMenu"].top = top.pageYOffset + 135;
                document["divMenu"].visibility = "visible";
        }
        else if ( bExplorer4plus ) {
                divMenu.style.top = document.body.scrollTop + 320;
                divMenu.style.visibility = "visible";
        }
        CheckUIElements();
        return true;
}
OnLoad();
//-->
</script>
<!-----슬라이드끝---->

 

 

가로 900의 가운데 정렬의 레이아웃된 사이트에서 오른쪽 여백에 베너등을 넣을때

레이어위치를 사용자 브라우저 크기와 상관없이 고정시킬때 사용하는 소스입니다.

가운데 정렬시킨 가로 900 테이블을 왼쪽위에점을 좌표값 0으로 잡히게 되는 원리입니다.

녹색은 레이아웃된 테이블의 크기이고, 빨간색은 레이어의 가로 위치를 나타냅니다.