회원가입∴아이디/비번찾기
홈으로


운.영.자.1대1.상담
스마트라디오(Smart Radio)
음악방송 앱 다운로드
E.Q. Christmas Tree
E.Q. 오디오 플레이어
가사검색
컴퓨터 오목
멀티 동영상 플레이어
실시간 TV보기
myTUBE MOVIE PLUS
DANCING GIRL
MODEL HOT MOVIES
스마트웹 에서 음악감상
K-POP 걸그룹 MV 2023
보안∵서버∵쿠키
윈도우∵프레임
이미지∵배경
시간∵달력∵계산
상태바∵타이틀바
음악∵영상
폼∵전송∵테이블
키보드∵마우스
효과∵링크∵메뉴
Script∵php
기타
PHP 강좌
윈도우관련팁
웹관련팁
홈페이지제작팁
기본강좌
레지스트리
윈도우서버
리눅스서버
Android
부드럽게 슬라이딩 되면서 펼쳐지는 메뉴구성
17년 전
<HTML>
<HEAD>
    <TITLE>xtx.kr</TITLE>
<style type="text/css">
    .link {position:absolute;left:0;width:100%;height:0;background:efefef;overflow:hidden;visibility:hidden;}
    .title   {position:relative;cursor:pointer;width:100%;background:c0c0c0;font-family:tahoma;font-size:11px;left:2;height:15;overflow:hidden;}
    .title_o {position:relative;cursor:pointer;width:100%;background:c0c0c0;font-family:tahoma;font-size:11px;left:2;height:15;overflow:hidden;}
    .text {position:relative;text-align:justify;margin:10px;font-family:tahoma;font-size:11px;color:#000000;overflow:hidden;height:90%}

</style>

<script type="text/javascript">
<!--
var object = new Array();

function Slide(N,oCont){
    this.N  = N;
    this.S  = 1.1;
    this.object = new Array();

    this.CObj = function (parent,N){
    
        this.parent = parent;
        this.N = N;
        this.obj = parent.frm[N];
        this.tit = this.obj.firstChild;
        this.div = this.obj.getElementsByTagName("div")[1];
        this.div.style.visibility = "hidden";
        this.y0 = N * 18;
        this.Y1 = this.y0;
        this.obj.style.top = this.y0;
        this.obj.style.height = parent.H - (parent.NF-1) * 18 - 3;
        this.obj.style.visibility = "visible";
        this.obj.parent = this;
        this.run = false;
        
        this.move = function(){
            with(this){
                dy = (y1-y0)/parent.S;
                if(Math.abs(dy)>.1){
                    y0+=dy;
                    obj.style.top = Math.round(y0);
                    setTimeout("object["+parent.N+"].object["+N+"].move();", 16);
                } else {
                    run = false;
                    if(dy>0)div.style.visibility="hidden";
                    else if(N>0)parent.object[N-1].div.style.visibility="hidden";
                }
            }
        }
        
        this.obj.onmouseover = function(){
            with(this.parent){
                if(!run){
                    run = true;
                    div.style.visibility="visible";
                    for(i=0;i<parent.NF;i++)parent.object[i].tit.className = "title";
                    tit.className = "title_o";
                    for(i=0;i<=N;i++){
                        parent.object[i].y1 = i*18;
                        parent.object[i].move();
                    }
                    for(i=N+1;i<parent.NF;i++){
                        parent.object[i].y1 = parent.H-(parent.NF-i)*18;
                        parent.object[i].move();
                    }
                }
            }
        }
    }

    this.frm = document.getElementById(oCont);
    this.H = parseInt(this.frm.style.height);
    this.frm = this.frm.getElementsByTagName("span");
    this.NF = this.frm.length;
    for(i=0;i<this.NF;i++) this.object[i] = new this.CObj(this, i);
    this.object[0].obj.onmouseover();
    this.S = 10;
}

onload = function() {
    object[0] = new Slide(0, "frames");
}

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

<body>

<div id="frames" style="width:160; height:200; position:absolute; z-index:1; overflow:hidden">

    <span class="link"><div class="title">Main MENU 01</div>
        <div class="text">
        - SUB MENU 01<br>
        - SUB MENU 01<br>
        - SUB MENU 01<br>
        - SUB MENU 01<br>
        </div>
    </span>
    <span class="link"><div class="title">Main MENU 02</div>
        <div class="text">
        - SUB MENU 02<br>
        - SUB MENU 02<br>
        - SUB MENU 02<br>
        - SUB MENU 02<br>
        </div>
    </span>
    <span class="link"><div class="title">Main MENU 03</div>
        <div class="text">
        - SUB MENU 03<br>
        - SUB MENU 03<br>
        - SUB MENU 03<br>
        - SUB MENU 03<br>
        </div>
    </span>
    <span class="link"><div class="title">Main MENU 04</div>
        <div class="text">
        - SUB MENU 04<br>
        - SUB MENU 04<br>
        - SUB MENU 04<br>
        - SUB MENU 04<br>
        </div>
    </span>
    <span class="link"><div class="title">Main MENU 05</div>
        <div class="text">
        - SUB MENU 05<br>
        - SUB MENU 05<br>
        - SUB MENU 05<br>
        - SUB MENU 05<br>
        </div>
    </span>
    <span class="link"><div class="title">Main MENU 06</div>
        <div class="text">
        - SUB MENU 06<br>
        - SUB MENU 06<br>
        - SUB MENU 06<br>
        - SUB MENU 06<br>
        </div>
    </span>
    <span class="link"><div class="title">Main MENU 07</div>
        <div class="text">
        - SUB MENU 07<br>
        - SUB MENU 07<br>
        - SUB MENU 07<br>
        - SUB MENU 07<br>
        </div>
    </span>
</div>


</body>
</html>
추천추천 : 280 추천 목록
번호 제목
24
 HTML 풍선 도움말에서 설명 줄 바꾸는 방법
23
 flash player 버젼업되면서 getURL안되는 문제 1
22
 브라우저 시작페이지를 지정하는 스크립트
21
 go Top, go Bottom 버튼 만들기
20
 바운스되면서 따라다니는 Floating Menu
19
 버튼을 클릭하면 노트패드를 실행합니다..
18
 MARQUEE 태그
17
 text-overflow
16
 textarea 텍스트 입력창에 넓이값에 자동으로 반응하는 팁
15
 박스안의 글이 상하좌우..원하는 방향으로..
14
 특이한 글자애니메이션
13
 링크에 마우스를 올리면 반짝이는 효과를
12
 PHP에서 페이지 이동
11
 클릭해도 움직이지 않는 href="#" 보다 강력한것
10
 팝업 생성기 2
9
 링크 스타일 생성기
8
 context menu - 팝업 레이어
부드럽게 슬라이딩 되면서 펼쳐지는 메뉴구성
6
 document.write문에 </script> 를 삽입했을때 에러 발생시...
5
 onClick 이벤트에 return 문에 사용 및 차이점
4
 레이어 사용시 Select객체에 가려지는 문제에 대한 해결책
3
 플래쉬 효과나는 신비 메뉴
2
 타 사이트의 프레임으로 문서가 들어가지 못하게
1
 로딩시 화면이 번쩍이는 효과
123
목록
취소

(뮤직트로트 앱 설치)
스마트웹 무료음악
BEST TOP 200
트로트TV
뽕짝아가씨
가요 BEST
KPOP MV
오아시스
못잊을옛날노래
미스트롯&화밤
VOD&MV
실시간 IPTV
종합성인가요방
추천가요＼인기
추억의옛노래
BillBoard Free
WOLRD POPs
HIT BillBoard
POP TOP BEST
최신인기가요특집
트로트성인가요
인기가요
Billboard POP
경음악＼기타
HOT 최신가요
HOT 성인가요
뮤직트로트 부산광역시 부산진구 가야동 ㅣ 개인정보취급방침
Copyright ⓒ musictrot All rights reserved.