묻고답하기

대충 주석을 한번 달아 봤어요.. ^^;

<HTML>
<HEAD>
<TITLE> JABA1009 ::: 플래쉬 같은 슬라이딩 메뉴 효과 </TITLE>
<!--1. 아래 스크립트를 HEAD 부분에 복사해 넣으세요. 없으면 그냥 두세요-->

<script>
<!-- Beginning of JavaScript -
var i_strength=0 // 그림자 필터 옵셋
var i_color=0 // 그림자 필터 색상 배열 인덱스
var max_strength=400 // 최대 크기

var shadowcolor=new Array() // 섀도우 색상을 배열로 담아서

shadowcolor[0]="FFFFFF"
shadowcolor[1]="EEEEEE"
shadowcolor[2]="DDDDDD"
shadowcolor[3]="CCCCCC"
shadowcolor[4]="BBBBBB"
shadowcolor[5]="AAAAAA"
shadowcolor[6]="999999"
shadowcolor[7]="888888"
shadowcolor[8]="777777"
shadowcolor[9]="666666"
shadowcolor[10]="555555"
shadowcolor[11]="444444"
shadowcolor[12]="333333"
shadowcolor[13]="222222"
shadowcolor[14]="111111"
shadowcolor[15]="000000"
shadowcolor[16]="000000"
shadowcolor[17]="000000"
shadowcolor[18]="000000"
shadowcolor[19]="000000"
shadowcolor[20]="000000"
shadowcolor[21]="000000"
shadowcolor[22]="000000"
shadowcolor[23]="000000"
shadowcolor[24]="000000"
var timer  // 필터 재귀 호출시 타임아웃 지정 변수
var speed=20 // 필터 재귀 호출시 시간 간격
var thisobj // 오브젝트를 담을 변수


function stopfilter(thisdiv){  // 스타일 필터 멈추기
   if (document.all) { // 익스플로러라면
       i_strength=0  //
       i_color=0  //
       clearTimeout(timer) // 타임아웃 클리어
               thisobj=thisdiv // 매개변수 레이어 오브젝트를 thisobj변수로 담음
       thisobj.style.filter=" " // 필터없앰
   }
}


function startfilter(thisdiv){ // 스타일 필터시작
   if (document.all) {  // 익스플로러라면
       i_strength=0
       i_color=0
       clearTimeout(timer) // 타임아웃 클리어
               thisobj=thisdiv // 매개변수 레이어 오브젝트를 thisobj변수로 담음
       morefilter() // 다음 필터적용함수 실행
   }
}

function morefilter(){
   if (i_strength <=max_strength) { // 그림자 옵셋이 최대 거리까지 떨어지지 않았으면
               thisobj.style.filter="dropShadow(color="+shadowcolor[i_color]+", offx="+i_strength+",offy=0)" // 색상 넣고 그림자를 가로로 움직임(0의 위치에서 최대 옵셋까지)
       i_strength=i_strength+20 // 옵셋을 20 늘림
       i_color++ // 컬러 배열 인덱스를 다음으로 이동
       timer = setTimeout("morefilter()",speed) // 재귀호출 실행 지정
   }
   else { // 그림자가 지정한 옵셋 거리 최대에 도달하면
       clearTimeout(timer) // 재귀호출 타이머 클리어
       lessfilter() // 다음 필터 적용함수 실행
   }
}

function lessfilter(){
   if (i_strength >=0) { // 그림자 옵셋이 0보다 크면
               thisobj.style.filter="dropShadow(color="+shadowcolor[i_color]+",offx="+i_strength+",offy=0)" // 색상 넣고 그림자 가로로 이동(최대 옵셋에서 0의 위치까지)
       i_strength=i_strength-20 // 옵셋을 20줄임
       i_color-- // 색상인덱스를 이전 색상으로 이동
       timer = setTimeout("lessfilter()",speed) // 재귀 호출
   }    
   else { // 옵셋이 0에 도달하면
       clearTimeout(timer) // 재귀호출 중지
       makepause() // 다음함수 실행
   }
}

function makepause(){
  timer = setTimeout("morefilter()",1000) // 1초뒤에 다시 morefilter와 lessfilter함수를 반복 실행되도록 지정
}

// - End of JavaScript - -->
</script>

<script language=javaScript>
var isNav = (navigator.appName.indexOf("Netscape")!=-1) // 넷스케이프여부 판단

var colors = new   Array("FFFFFF","FFFFFF","FFFFFF","FFFFFF","FFFFFF","FFFFFF","FFFFFF","F9F9F9","F1F1F1","E9E9E9","E1E1E1","D9D9D9","D1D1D1","C9C9C9","C1C1C1","B9B9B9","B1B1B1","A9A9A9","A1A1A1","999999","919191","898989","818181","797979","717171","696969","616161","  595959","515151","494949","414141","393939","313131","292929","212121","191919","111111","090909","000000")  // 배열지정
var i = -37
var msg = 0

var linkto = new Array() // 링크시킬 제목들
linkto[0] = "Home"
linkto[1] = "Email me"
linkto[2] = "Hotmail"
linkto[3] = "Micosoft"
linkto[4] = "Jaba1009"
linkto[5] = "Lycos"
linkto[6] = "Ask"
linkto[7] = "Yahoo"
linkto[8] = "Excite"

function startStrobe(msgnum)
           {msg=msgnum  // 매개변수 넘기기 (그냥 막바로 넣어도 되는데... 변수 낭비인 듯..--;)
           strobeEffect(msg,-37)} // 스트롭효과 함수 실행

function strobeEffect(msgnum,i)
{
           msg=msgnum  // 매개변수 넘기기.. 역시나 변수 낭비..
           if (i < 38){ // i값이 38보다 작은 경우
                        starttable = "<table width=200><td><center><font color=" + colors[Math.abs(i)] + " size=+2>"
                       endtable = "</font></a></center></td></table>"
                       fulltable = starttable + linkto[msg] + endtable // 링크 제목을 넣어서 가로 크기가 200인 테이블을 각각 만든다.
                       j = i + 1 // 지정한 색상을 바꾸기위한 색상 배열 인덱스를 증가 시킨다.
                                   if(isNav) // 넷스인경우
                                               {document.object0.document.write(fulltable) // object0에다가 위에서 만든 테이블을 넣는다.
                                               document.object0.document.close()} // 문서를 닫는다.
                                   else {object0.innerHTML = fulltable} // object0에 막바로 innerHTML을 이용하여 화면에 표시한다.
           }
           else {return false}
           setTimeout("strobeEffect(msg,j)",20) // 재귀 실행
           }

</script>
          
<style type="text/css">
body {cursor:crosshair;}
.mi { text-decoration:none; color:#C299F9; font-size:9pt; cursor:hand; }
.ms { text-decoration:none; color:#FEE101; font-size:10px; display:none; }
.t { padding:5; }
.sl { text-decoration:none; color:#FEE101; }
.sl:hover { text-decoration:underline; color:#FFFFCC; }
//.ddt { padding:5; text-align:right; position:absolute; left:0; top:-20; width:130;}
// display: block
</style>

<script LANGUAGE="JavaScript">
<!--
//var d = (navigator.userAgent.indexOf("MSIE 5")>-1) ; // 사용안함

if (parent && parent.gal_main) parent.gal_main.location='online/?station=101'; // 부모 프레임이나 부모프레임중 gal_main이란 프레임이 존재하면 gal_main의 주소는 online/?station=101으로 (별필요없는 구문인듯)

var d =(parseInt(navigator.appVersion)>=4 && navigator.appName=="Microsoft Internet Explorer"); 익스버전 4이상인경우 d는 true

items=9 ; // 아이템 갯수
fade_increment = new Array(items) ;
fade_present = new Array(items) ;
currentbranch=-1;

colordepth = new Array(10); // 변화시킬 색상 깊이
colordepth[0]="#707070";
colordepth[1]="#808080";
colordepth[2]="#909090";
colordepth[3]="#a0a0a0";
colordepth[4]="#b0b0b0";
colordepth[5]="#c0c0d0";
colordepth[6]="#d0d0d0";
colordepth[7]="#e0e0e0";
colordepth[8]="#f0f0f0";
colordepth[10]="#ffffff";
started=false ;


for (i=0;i<items;i++) { // fade_increment, fade_present 모든 배열값을 0으로 지정
           fade_increment[i]=0;
           fade_present[i]=0;
}

function s(item,statustext) {
           window.status=(statustext?statustext:' '); // 윈도우 상태창에 statustext값이 있으면 statustext을 아니면 빈문자를 출력
       if (started && d) { // 페이지가 스타트되고 익스 버전 4이상인경우
                       var curr=item;  //아이템을 curr에 저장
                       fade_increment[curr]=(statustext?40:-7); curr인덱스의 배열에 statustext값을 40과 -7을 번갈아 담음
           }
           return true; // 함수 되돌림
}

function fadeloop() {
           rep="";
           for (i=0;i<fade_increment.length;i++) { //fade_increment 배열 수만큼 반복 실행
                       rep+=" "+fade_present[i]; // rep값에 fade_present배열값을 스페이스로 구분하여 누적시킴(문자열합침)
                       fade_present[i]+=fade_increment[i] ; //fade_increment도 같이 더해 누적(문자열 합침)
                       if (fade_present[i]>=100) { // fade_present배열의 i번째 값이 100보다 크면
                                   fade_present[i]=100; // fade_present의 i번째 배열은 100
                                   fade_increment[i]=0; // fade_increment의 i번째 배열은 0
                       }
                       else if (fade_present[i]<=0) { //fade_present배열의 i번째 값이 0보다 작으면
                                   fade_present[i]=0;  // 둘다 0
                                   fade_increment[i]=0;
                       }
                       if (document.all['i'+i]) document.all['i'+i].style.color=colordepth[Math.round(fade_present[i]/10)]; 문서중에 아이디 값이 i0~i10 를 포함하는 오브젝트의 색상을 바꿈..
           }
           setTimeout('fadeloop()',50) ; // 재귀호출
}

function tog(b) {
           if (d) { // 익스플로러 4이상인경우
                       if (currentbranch==b) { // 매개변수 값 b의 값이 currentbranch와 동일하면
                                   document.all["s"+b].style.display='none'; // id값이 s매개변수 인 오브젝트를 감춘다.
                                   currentbranch=-1;                         // -1로 값을 지정
                       } else {
                                   if (currentbranch>-1) document.all["s"+currentbranch].style.display='none'; // 이전에 값을 토글형식으로 지정한다.
                                   document.all["s"+b].style.display='block';
                                   currentbranch=b;
                       }
           }
}

function positionitems() {
           for (a=0;a<items;a++) { 아이템 갯수만큼 실행한다.
                       document.all["t"+a].style.top=a*10; // id가 t0와같이 t숫자로 시작하는 모든 오브젝트의 상하 여백을 10픽셀로 맞춤
           }
}


function start() {
//            positionitems(); // 함수사용안함
           started=true ; // 시작됨을 변수로 지정
           if (d) fadeloop() ; //
}

//-->
</script>

<SCRIPT LANGUAGE="JavaScript">


<!-- Begin

function dropMenu() {  // 드롭메뉴
speed=1;  // 속도 조절
topdistance=100; // 상단 위치
items=9; // 아이템 갯수 (중복변수...)
y=-50; //
ob=1;
if (navigator.appName == "Netscape") { // 넷스케이프일 경우 속성값을 달리함(익스 넷스 구분 속성)
v=".top=",dS="document.",sD="";
}
else {
v=".pixelTop=",dS="",sD=".style";
  }
}

function scrollItems() { // 메뉴 아이템을 스크롤하는 함수
if (ob<items+1) { // 아이템 갯수 보다 ob갯수가 작을 경우(아이템 갯수만큼 실행하기)
    objectX="object"+ob; y+=10; eval(dS + objectX + sD + v + y); // document.object1.style.top 이런식의 구문인데.. 넷스와 익스 구분을 위해
    if (y<topdistance) setTimeout("scrollItems()",speed); // 최상단 위치보다 y가 작을 경우 재귀 실행
    else y=-50, topdistance+=40, ob+=1, setTimeout("scrollItems()",speed); // 아닐(현재 아이템이 다 이동되었을)경우 최상단 위치를 40더해서 다음아이템으로 이동
  }
}
// End -->
</SCRIPT>

</HEAD>

<BODY BGCOLOR="#000000" onLoad="dropMenu(), scrollItems(), start();">

<!--3. BODY 부분에 아래의 스크립트를 복사해 넣으세요-->

<center>

<div id="object0" style="position:absolute; visibility:show; left:0px; top:40px; z-index:2"></div>
<div id="object1" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">

<table border=0 width=150>
<td><center>
<div class=t id="t0"  onmouseover="return s(0,'Home')" onmouseout="return s(0)"><nobr><a href="http://www.jaba1009.pe.kr" class=mi id="i0" onmouseover="startStrobe(0)" target="main">Home</a></nobr></div>
</center></td>
</table>
</div>
<div id="object2" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">
<table border=0 width=150>
<td><center>
<div class=t id="t1"  onmouseover="return s(1,'Email me')" onmouseout="return s(1)"><nobr><a href="mailto:ehanulee@netian.com" class=mi id="i1" onmouseover="startStrobe(1)">Email me</a></nobr></div>
</center></td>
</table>
</div>
<div id="object3" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">
<table border=0 width=150>
<td><center>
<div class=t id="t2"  onmouseover="return s(2,'Check mail')" onmouseout="return s(2)"><nobr><a href="http://www.hanmail.net" class=mi id="i2" onmouseover="startStrobe(2)">HanMail</a></nobr></div>
</center></td></table>
</div>
<div id="object4" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">
<table border=0 width=150>
<td><center>
<div class=t id="t3"  onmouseover="return s(3,'Microsoft')" onmouseout="return s(3)"><nobr><a href="http://www.microsoft.com" class=mi id="i3" onmouseover="startStrobe(3)">Microsoft</a></nobr></div>
</center></td>
</table>
</div>
<div id="object5" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">
<table border=0 width=150>
<td><center>
<div class=t id="t4"  onmouseover="return s(4,'Javascripts')" onmouseout="return s(4)"><nobr><a href="http://www.jaba1009.pe.kr" class=mi id="i4" onmouseover="startStrobe(4)">Jaba1009</a></nobr></div>
</center></td>
</table>
</div>
<div id="object6" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">
<table border=0 width=150>
<td><center>
<div class=t id="t5"  onmouseover="return s(5,'Lycos')" onmouseout="return s(5)"><nobr><a href="http://www.lycos.co.kr" class=mi id="i5" onmouseover="startStrobe(5)">Lycos</a></nobr></div>
</center></td>
</table>
</div>
<div id="object7" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">
<table border=0 width=150>
<td><center>
<div class=t id="t6"  onmouseover="return s(6,'Ask')" onmouseout="return s(6)"><nobr><a href="http://www.yahoo.co.kr" class=mi id="i6" onmouseover="startStrobe(6)">Yahoo!</a></nobr></div>
</center></td>
</table>
</div>
<div id="object8" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">
<table border=0 width=150>
<td><center>
<div class=t id="t7"  onmouseover="return s(7,'Yahoo')" onmouseout="return s(7)"><nobr><a href="http://www.yahoo.co.jp" class=mi id="i7" onmouseover="startStrobe(7)">Yahoo! Japan</a></nobr></div>
</center></td>
</table>
</div>
<div id="object9" style="position:absolute; visibility:show; left:0px; top:-50px; z-index:2" onMouseOver="startfilter(this)" onMouseOut="stopfilter(this)">
<table border=0 width=150>
<td><center>
<div class=t id="t8"  onmouseover="return s(8,'Excite')" onmouseout="return s(8)"><nobr><a href="http://www.excite.com" class=mi id="i8" onmouseover="startStrobe(8)">Excite</a></nobr></div>
</center></td>
</table>
</div>
</center>

</BODY>
</HTML>


소스를 분석해 본 결과 좀 효율적인 소스는 못되더군요.. 좀 오래된 소스 인듯...
filter 효과 및 글자 색상 바뀌는 부분에 변수 낭비가 심하더군요..
메뉴 같은 것은 그냥 심플하게 만드시는게 오히려 나을 것 같네요..
글쓴이 제목 최종 글
XE 공지 글 쓰기,삭제 운영방식 변경 공지 [16] 2019.03.05 by 남기남
nike077 제로보드 xe 회원가입 모듈에서 "메일링 가입" 을 "예" 로 설정하고 싶은데 잘 안됩니다!!! [6] 2016.05.03 by 추억팔이
nocoke 홈페이지 게시판들을 다 열 수가 없습니다. file  
라웅 분류앞에 게시글수가 표시되잖아요. [3] 2016.05.03 by 찬란하리
v7studio 회원 레벨 조절 권한 [2] 2016.05.03 by v7studio
어라얼랑 jquery와 레이아웃 재 호출 문제인것 같습니다  
왕초보초보 사이트 디자인설정 오류에 대해 [2] 2016.05.03 by 왕초보초보
왕초보초보 설치 오류입니다. 도와주세요  
멀더요원 쪽지보내기 오류 입니다. [1] file 2016.05.03 by 기진곰
탱탱 xe코드 설치 관련 에러!! [1] file 2016.05.03 by 기진곰
이상석 php 업그레이드 문의드려요 [3] file 2016.05.03 by 기진곰
빙짱 누리고 비회원 결제 시 "구매자 이메일주소가 빠졌습니다" alert [1] 2016.05.03 by 빙짱
고고싱229af 사이트속도가 너무느립니다 [3] 2016.05.03 by MarvelWorks
하늘 큰사랑 쉬운 설치를하면 위와 같이 에러 메세지가 나옵니다 [2] 2016.05.03 by sejin7940
최태진814 이것을 어떻게 수정해야 하죠? [3] 2016.05.03 by sejin7940
무지개 게시판에 사진/동영상을 업로드하려고 하는데, 오류가 뜹니다. [1] file 2016.05.03 by sejin7940
유진123 db에 접속해서 비추천 혹은 신고를 누가 했는지 알수있는 방법 [4] 2016.05.03 by 유진123
대구미녀 xenon hs 파일첨부란 밀림 해결 부탁드립니다 ㅠ [3] file 2016.05.04 by Xiso
유진123 db접속 하는 방법 [4] 2016.05.04 by Xiso
sujon**** 웹관련해서는 처음 공부하는데 질문있습니다. [2] 2016.05.04 by Xiso
고강백 처음 깔았는 데 어떻게 시작하는지 모르겠습니다.. [1] 2016.05.04 by Xiso
will 메뉴관련 [4] 2016.05.04 by 슈퍼타이
가르송 누리고 쇼핑몰 핸드폰으로 볼때..  
제로攻略 IT강국 홈페이지들이 외국인이 회원가입하는걸 거부하나요? [10] 2016.05.04 by 외국인
피르 PHP 업그레이드도 했고 새로 설치 했는데요.. file  
수우린 2차메뉴와 3차메뉴를 완전히 수정가능할까요? [1] 2016.05.04 by 라자루스
피르 XE 새로 설치하는중입니다. [2] 2016.05.04 by 피르
재이리 db정보입력 문의 드립니다 [1] 2016.05.04 by 우리아기
슈퍼타이 메뉴문제입니다. [1] 2016.05.04 by ehii
구름의저편 스케치북 모바일 레이아웃 질문입니다. [1] 2016.05.05 by dddd
마로지기 웹사이트 통째로 이전(db복원시 오류) [6] file 2016.05.05 by 마로지기