스크롤 따라 다니는 메뉴

지지온 2012.06.11 22:15:32 출처:
마우스 따라 레이어 고정 

<!-- script menu --> 
                <!-- 속도와 left,right,top,bottom 의 위치값을 조정할수 있습니다.... 
         근데요.. 몇번 테스트하셔야.. 할겁니다......          --> 

<script language=javascript> 
<!-- //배너 따라다니기> 

var isDOM = (document.getElementById ? true : false); 
var isIE4 = ((document.all && !isDOM) ? true : false); 
var isNS4 = (document.layers ? true : false); 

function getRef(id) 
{ 
        if (isDOM) return document.getElementById(id); 
        if (isIE4) return document.all[id]; 
        if (isNS4) return document.layers[id]; 
} 

var isNS = navigator.appName == "Netscape"; 

function moveRightEdge() 
{ 
        var yMenuFrom, yMenuTo, yOffset, timeoutNextCheck; 
        if (isNS4) 
        { 
                yMenuFrom   = divMenu.top; 
                yMenuTo     = windows.pageYOffset + 0;   // 위쪽 위치 
        } 
        else if (isDOM) 
        { 
                yMenuFrom   = parseInt (divMenu.style.top, 0); 
                yMenuTo     = (isNS ? window.pageYOffset : document.body.scrollTop) + 273; // 위쪽 위치 
        } 

        timeoutNextCheck = 500; 

        if (yMenuFrom != yMenuTo) 
        { 
                yOffset = Math.ceil(Math.abs(yMenuTo - yMenuFrom) / 20); 
                if (yMenuTo < yMenuFrom) 
                        yOffset = -yOffset; 
                if (isNS4) 
                        divMenu.top += yOffset; 
                else if (isDOM) 
                        divMenu.style.top = parseInt (divMenu.style.top, 10) + yOffset; 
                        timeoutNextCheck = 10; 
        } 
        setTimeout ("moveRightEdge()", timeoutNextCheck); 
} 
--> 
</script> 



<!------------------ 움직이는 테이블 layer ------------------------------------- --> 
<div id="divMenu" style="position:absolute; left:806px; top:265px; width:109px; height:249px; z-index:1"> 
  <table width="109" height="249" border="0" cellpadding="0" cellspacing="0"> 
    <tr> 
      <td valign="top"><table width="109" border="0" cellspacing="0" cellpadding="0"> 
          <tr> 
            <td><a href="http://jpmkorea.com/bbs/zboard.php?id=local1" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image14','','jpmmain/bannerover_01.gif',1)"><img src="jpmmain/banner_01.gif" name="Image14" width="109" height="42" border="0"></a></td> 
          </tr> 
          <tr> 
            <td><a href="http://jpmkorea.com/bbs/zboard.php?id=local2" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image15','','jpmmain/bannerover_02.gif',1)"><img src="jpmmain/banner_02.gif" name="Image15" width="109" height="42" border="0"></a></td> 
          </tr> 
          <tr> 
            <td><a href="http://jpmkorea.com/bbs/zboard.php?id=local3" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image16','','jpmmain/bannerover_03.gif',1)"><img src="jpmmain/banner_03.gif" name="Image16" width="109" height="42" border="0"></a></td> 
          </tr> 
          <tr> 
            <td><a href="http://jpmkorea.com/bbs/zboard.php?id=local4" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image17','','jpmmain/bannerover_04.gif',1)"><img src="jpmmain/banner_04.gif" name="Image17" width="109" height="41" border="0"></a></td> 
          </tr> 
          <tr> 
            <td><a href="http://jpmkorea.com/bbs/zboard.php?id=local5" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image18','','jpmmain/bannerover_05.gif',1)"><img src="jpmmain/banner_05.gif" name="Image18" width="109" height="41" border="0"></a></td> 
          </tr> 
          <tr> 
            <td><a href="http://jpmkorea.com/bbs/zboard.php?id=local6" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image19','','jpmmain/bannerover_06.gif',1)"><img src="jpmmain/banner_06.gif" name="Image19" width="109" height="41" border="0"></a></td> 
          </tr> 
        </table></td> 
    </tr> 
  </table> 
</div> 
<!------------------ 움직이는 테이블 layer end.. ------------------------------------- --> 

<script language=javascript> 
<!-- //배너 따라다니기> 
if (isNS4) 
{ 
        var divMenu = document["divMenu"]; 
        divMenu.top = top.pageYOffset + 100; 
        divMenu.visibility = "visible"; 
        moveRightEdge(); 

} 
else if (isDOM) 
{ 
        var divMenu = getRef('divMenu'); 
        divMenu.style.top = (isNS ? window.pageYOffset : document.body.scrollTop) + 100; 
        divMenu.style.visibility = "visible"; 
        moveRightEdge(); 
} 
//--> 
</script>