웹마스터 팁

원래 steelheart 님이 만드신 이동 메뉴 스크립트를 쓰다가 네츠케이프에서 아예 메뉴조차도 나오지 않는 호환성 때문에 약간의 불편함을 감수해야 했습니다. 그런데 이상하게도 제로님 홈페이지에서는 네츠케입에서도 메뉴가 정상적으로 출력이 되더라구요. 그래서 제로님의 홈페이지에 있는 소스를 보고서 필요한 부분만 발췌해서 이렇게 내놓습니다. 네츠케이프에서도 지원되는 이동메뉼르 구현하실 분들만 쓰도록 하세요.

(이게 원래는 이동 체크하는 부분이 있는데... 그부분의 action 파일이 어떤 구조로 돌아가는 지를 모르겠어서 그냥 주석처리했습니다. 언젠가는 밝혀지겠죠 ㅡㅡ;; 그냥 하단의 부분만 자바스크립트로 어떻게 해도 되지 않을까 생각하지만.. ㅡㅡ;; 어떤 분께서 그냥 not_ani.html 의 구조를 알려주심 좋겠네요. 그 파일이 아마 하단 자바스크립트를 지우고 다시 로드해주는 파일로 보입니다.)

소스 길이도 적도 꽤 괜찮습니다. 문제는 네츠케이에서는 이동 속도가 죽음이라는데 있지만.. --;; 네츠케이프의 문제인것 같고.. 메뉴만 나오는 것도 다행이라고 할 수 있죠...
홈페이지에 맞도록 변수를 수정해서 쓰세요.

ps. 왼쪽 마진과 초기 시작 위치는 은 div 태그의 style 옵션에서 설정을 해주면 됩니다.


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


<!-- 메뉴이동 스크립트 -->
<SCRIPT language=javascript>
<!-- //
        var _scroll_topmargin=254;        // 이동 메뉴의 상단 한계 픽셀
        var _scroll_ing_topmargin=3;         // 움직이는 도중의 상단과의 간격
        var _scroll_activate_speed=500;        // 초기 움직임을 감지하는 시간차이 (1/1000초)
        var _scroll_ing_activate_speed=10;        // 움직이기 시작한 이후에 감지하는 시간차이 (1/1000초)

        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+_scroll_ing_topmargin;
                } else if (isDOM) {
                        yMenuFrom   = parseInt (divMenu.style.top, 10);
                        yMenuTo     = (isNS ? window.pageYOffset : document.body.scrollTop)+_scroll_ing_topmargin;
                }
                if(yMenuTo<_scroll_topmargin) yMenuTo = _scroll_topmargin;

                timeoutNextCheck = _scroll_activate_speed;

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

<DIV id=divMenu style="LEFT: 13px; VISIBILITY: visible; WIDTH: 145; POSITION: absolute; TOP: 254px; z-index=2">

<!-- 메뉴가 들어갈 부분... 본인의 홈페이지에 맞게 적당히 편집하세요. -->
        
<!-- 메뉴부분 끝 -->


<!-- 메뉴이동 기능 -->
<!--
<table border=0>
<form action=<?=$_cscafe_url?>share/not_ani.html method=get>        // 이 부분이 어떻게 동작하는 지를 알 수 없음.
<tr>
        <td>
                <input type=checkbox name=not_ani value=1  onclick=submit()> 메뉴이동 기능 끄기
        </td>
</tr>
</form>
</table>
-->
</DIV>

<SCRIPT language=javascript>
<!-- //
if (isNS4) {
        var divMenu = document["divMenu"];
        divMenu.top = top.pageYOffset + _scroll_topmargin;
        divMenu.visibility = "visible";
        moveRightEdge();
}
else if (isDOM) {
        var divMenu = getRef('divMenu');
        divMenu.style.top = (isNS ? window.pageYOffset : document.body.scrollTop) + _scroll_topmargin;
        divMenu.style.visibility = "visible";
        moveRightEdge();
}
//-->
</SCRIPT>