슬라이딩메뉴(퀵메뉴) 제어

페이지 우측에 두는 슬라이딩(퀵)메뉴가 화면 하단에서 멈추지 않고 계속 내려가는 문제를 해결한 스크립트 소스입니다.

 

-----------------------------------------------------------------------------------------------------------

 

<div id="slide1" style="width:31px; height:143px; position:absolute; left:919px; top:170px; z-index:100;">
<table border="0" cellspacing="0" cellpadding="0">
<tr><td>내용</td></tr>

</table>
</div>

<script language="JavaScript" type="text/JavaScript">
        var StartPos = 230; // 슬라이드 메뉴 시작위치
        var x = 909; // 화면 왼쪽으로 부터 떨어지는 위치
        var Y = 163; // 페이지 헤더부분의 여백 (화면 위쪽으로 부터 떨어지는 위치)
        var slideY = 180; // 슬라이드시 브라우저 상단과 띄워지는 거리
        var StopPoint = document.body.scrollHeight - 600; //슬라이드가 멈추는 위치
  //document.body.scrollHeight : 전체스크롤 길이
        var slideWatch;
        var slideSpeed = 100; // 슬라이드 속도
        var slideSpeed2 = 20; //

        function Refreshslide1()
        {
                var stmnStartPoint, stmnEndPoint, stmnRefreshTimer;

                stmnStartPoint = parseInt(slide1.style.top, 10);
                stmnEndPoint = document.body.scrollTop + slideY;
                if (stmnEndPoint < Y) stmnEndPoint = Y;

                stmnRefreshTimer = slideSpeed;

                if ( stmnStartPoint != stmnEndPoint ) {
                        stmnScrollAmount = Math.ceil( Math.abs( stmnEndPoint - stmnStartPoint ) / 15 );
                        slide1.style.top = parseInt(slide1.style.top, 10) + ( ( stmnEndPoint<stmnStartPoint ) ? -stmnScrollAmount : stmnScrollAmount );
                        if (parseInt(slide1.style.top, 10)>StopPoint) slide1.style.top = StopPoint;
                        stmnRefreshTimer = slideSpeed2;

                }

                slideWatch = setTimeout ("Refreshslide1();", stmnRefreshTimer);
        }

 Refreshslide1(); 
</script>