욧

스크롤 퀵메뉴 만들려고 하는데..

오른쪽에 스크롤 내리면 오르락 내리락 하는 메뉴 있잖아요?
그걸 만들려고 하는데
나모로 만들수 있다던데 어떻게 하는거에요?
그리고 제가
팀에서 봣는데
head.sub.php맨 하단에 카피
---------------------------------
<script language="javascript">

        var stmnLEFT = 130; // 스크롤메뉴의 좌측 위치. 필요 없을 경우 삭제
        var stmnGAP1 = 150; // 페이지 헤더부분의 여백 (이보다 위로는 올라가지 않음)
        var stmnGAP2 = 10; // 스크롤시 브라우저 상단과 약간 띄움. 필요없으면 0으로 세팅
        var stmnBASE = 200; // 스크롤메뉴 초기 시작위치 (아무렇게나 해도 상관은 없지만 stmnGAP1과 약간 차이를 주는게 보기 좋음)
        var stmnActivateSpeed = 200; // 움직임을 감지하는 속도 (숫자가 클수록 늦게 알아차림)
        var stmnScrollSpeed = 10; // 스크롤되는 속도 (클수록 늦게 움직임)

        var stmnTimer;

        // 쿠키 읽기
        function ReadCookie(name)
        {
                var label = name + "=";
                var labelLen = label.length;
                var cLen = document.cookie.length;
                var i = 0;

                while (i < cLen) {
                        var j = i + labelLen;

                        if (document.cookie.substring(i, j) == label) {
                                var cEnd = document.cookie.indexOf(";", j);
                                if (cEnd == -1) cEnd = document.cookie.length;

                                return unescape(document.cookie.substring(j, cEnd));
                        }
     
                        i++;
                }

                return "";
        }

        // 쿠키 저장
        function SaveCookie(name, value, expire)
        {
                var eDate = new Date();
                eDate.setDate(eDate.getDate() + expire);
                document.cookie = name + "=" + value + "; expires=" +  eDate.toGMTString()+ "; path=/";
        }

        // 스크롤 메뉴의 위치 갱신
        function RefreshStaticMenu()
        {
                var stmnStartPoint, stmnEndPoint, stmnRefreshTimer;

                stmnStartPoint = parseInt(STATICMENU.style.top, 10);
                stmnEndPoint = document.body.scrollTop + stmnGAP2;
                if (stmnEndPoint < stmnGAP1) stmnEndPoint = stmnGAP1;

                stmnRefreshTimer = stmnActivateSpeed;

                if ( stmnStartPoint != stmnEndPoint ) {
                        stmnScrollAmount = Math.ceil( Math.abs( stmnEndPoint - stmnStartPoint ) / 15 );
                        STATICMENU.style.top = parseInt(STATICMENU.style.top, 10) + ( ( stmnEndPoint<stmnStartPoint ) ? -stmnScrollAmount : stmnScrollAmount );
                        stmnRefreshTimer = stmnScrollSpeed;
                }

                stmnTimer = setTimeout ("RefreshStaticMenu();", stmnRefreshTimer);
        }

        // 메뉴 ON/OFF 하기
        function ToggleAnimate()
        {
                if (ANIMATE.checked) { // 이동하기 버튼이 체크되었다면
                        RefreshStaticMenu(); // 메뉴위치를 다시 조정
                        SaveCookie("ANIMATE", "true", 300); // 이동이 ON 상태라고 쿠키를 설정
                }
                else { // 아니라면... (이동하기 버튼이 체크되어 있지 않으면)
                        clearTimeout(stmnTimer); // 이동용 타이머 해제
                        STATICMENU.style.top = stmnGAP1; // 메뉴의 위치를 상단으로 옮긴다.
                        SaveCookie("ANIMATE", "false", 300); // 이동상태가 "OFF" 임
                }
        }

        // 메뉴 초기화
        function InitializeStaticMenu()
        {
                if (ReadCookie("ANIMATE") == "false") { // 이동상태가 off 상태라면
                        ANIMATE.checked = false; // 체크표시를 지우고
                        STATICMENU.style.top = document.body.scrollTop + stmnGAP1; // 맨 위에 들러 붙는다.
                }
                else { // 이동 on 상태라면
                        ANIMATE.checked = true; // 체크표시를 하고
                        STATICMENU.style.top = document.body.scrollTop + stmnBASE; // 기본위치로 이동한다.
                        RefreshStaticMenu(); // 스크립트 가동
                }

                STATICMENU.style.left = stmnLEFT; // 메뉴 왼쪽 위치 초기화. 필요없을 경우 삭제
        }

</script>
----------------------------------------------

적용하고자 하는곳에 카피

<!-- 스크롤메뉴를 위한 구성입니다. -->
<div id="STATICMENU" style="position:absolute; z-index:100; left:-5000px;">

        <!-- 메뉴가 들어갈 부분... 본인의 홈페이지에 맞게 적당히 편집하세요. -->
        <table cellpadding="5" cellspacing="0" border="1" style="background:#cccccc; width:200px;">
        <tr>
                <td style="font-weight:bold; text-align:center;">퀵메뉴</td>
        </tr>
        <tr>
                <td><?=latest_banner("banner_right","rightbanner", 5, 1); ?></td>
        </tr>
        </table>
        <!-- 메뉴부분 끝 -->

        <!-- 애니메이션 유무를 체크하는 부분 -->
        <input id="ANIMATE" type="checkbox" onclick="ToggleAnimate();"> Animate

        <!-- 스크롤메뉴를 가동하는 자바스크립트 -->
        <script language="javascript">InitializeStaticMenu();</script>


</div>
<!-- 스크롤 메뉴 정의 끝 -->
 
이런 글이 있더라고요
도제히 머가 먼지 몰라서요
좀 쉽ㄱㅔ쉽게 적용하는 방법 없나요?
나모로 만들수 있으면 좀 가르쳐 주세요
|

댓글 1개

// float.js 소스 아래의 내용을 float.js파일로 /js/float.js에 저장
// (<script language="Javascript" src="../js/float.js"></script> 본문삽입)

// -----------------------------------------------------------------------------------------------------------------------------------
self.onError=null;
currentX = currentY = 0;
whichIt = null;
lastScrollX = 0; lastScrollY = 0;
NS = (document.layers) ? 1 : 0;
IE = (document.all) ? 1: 0;
<!-- STALKER CODE -->
function heartBeat() {
if(IE) {
diffY = document.body.scrollTop;
diffX = 0;
}
if(NS) { diffY = self.pageYOffset; diffX = self.pageXOffset; }
if(diffY != lastScrollY) {
percent = .1 * (diffY - lastScrollY);
if(percent > 0) percent = Math.ceil(percent);
else percent = Math.floor(percent);
if(IE) document.all.floater.style.pixelTop += percent;
if(NS) document.floater.top += percent;
lastScrollY = lastScrollY + percent;
}
if(diffX != lastScrollX) {
percent = .1 * (diffX - lastScrollX);
if(percent > 0) percent = Math.ceil(percent);
else percent = Math.floor(percent);
if(IE) document.all.floater.style.pixelLeft += percent;
if(NS) document.floater.top += percent;
lastScrollY = lastScrollY + percent;
}
}
if(NS || IE) action = window.setInterval("heartBeat()",1);
// ----------------------------------------------------------------여기까지 js내용-------------------------------------------------
// --------------------------------------------------------------------------------------------------------------------------------------

// 아래의 내용은 특정이름의 php파일로 저장하여 tail부분에 인클루드
(<? include_once("$g4[path]/main/right_tab.php"); ?>) // $g4[path]는 그누보드 내에서 해당파일이 돌때에만

// ---------------------------------------------------------------------------------------------------------------------------------------
<DIV id=floater style="VISIBILITY: visible; LEFT: 905px; TOP: 130px; z-index: 10; width: 85; layer-background-color: #FF9900; border: 1px none #000000" align=left>
<table width="85" height="374" border="0" cellpadding="0" cellspacing="0">
<tr>
내용들어가는부분
</td>
</tr>
</table>
</div>
// ------------------------------------------------------------------------------------------------------------------------------------
// ----------------------------------------------------------------여기까지 right_tab내용-------------------------------------
댓글을 작성하시려면 로그인이 필요합니다.

그누보드4 관련 질문은 QA 로 이전됩니다. QA 그누보드4 바로가기 기존 게시물은 열람만 가능합니다.

+
제목 글쓴이 날짜 조회
06-06-17 조회 1,693
06-06-17 조회 1,600
06-06-17 조회 1,514
06-06-16 조회 1,940
06-06-16 조회 1,076
06-06-16 조회 1,645
06-06-16 조회 1,799
06-06-16 조회 1,594
06-06-16 조회 3,172
06-06-16 조회 1,604
06-06-16 조회 1,653
06-06-16 조회 2,231
06-06-16 조회 1,256
06-06-16 조회 1,229
06-06-16 조회 1,112
06-06-16 조회 1,599
06-06-16 조회 1,842
06-06-16 조회 1,684
06-06-16 조회 1,367
06-06-16 조회 1,594