메뉴 건너뛰기

XE : Xpress Engine




웹디자인 강의


위에가 예제입니다; 쿨럭;

tanmanu_1.gif

on (rollOver) {                             // rollOver 이벤트(무비위에 마우스를 올리는 동안)가 발생할때,
        this.swapDepths(3);    // 무비클립의 Depth 값을 변경, 맨 위에 위치하게 하는겁니다;
        f_xscale *= 2;
        f_yscale *= 2;             // 마우스를 누르는 순간에 메뉴의 크기를 크게 하기 위해 변수값을 2배수로
                                                    곱합니다. 메뉴의 크기를 조절하기 위해 사용하는거랍니다;
}
on (rollOut) {                             // rollOut 이벤트(롤 아웃 되있을 때;;;;)가 발생할때,
        this.swapDepths(1);   // 메뉴를 다른 메뉴보다 아래에 배치하고,,
        f_xscale = 100;
        f_yscale = 100;         // 마우스를 때는 순간 원래 크기로 돌아갑니다.
}

--------복사용--------
on (rollOver) {
        this.swapDepths(3);
        f_xscale *= 2;
        f_yscale *= 2;
}
on (rollOut) {
        this.swapDepths(1);
        f_xscale = 100;
        f_yscale = 100;
}
----------------------
tanmanu_2_1.gif

onClipEvent (load) {                // 로드 됬을 때!!
        f_xscale = 100;
        f_yscale = 100;        // 초기 메뉴의 스케일값을 100으로 잡아주고,,
        f_x = 0;
        f_y = 0;                  // 탄성력을 주기 위한 변수를 줍니다, 초기값은 0
        f_mul = 0.7;            // 탄성을 주기위한 변수입니다. 변수 값이 커질수록 탄성력 증가!!
        f_ratio = 0.3;           // 메뉴의 크기를 적당한 비율로 변화시키기 위한 변수,
    this._alpha=95;                  // 초기 메뉴의 알파 값을 줍니다;
}
onClipEvent (enterFrame) {    // enterFrame 이벤트가 발생!!
        f_x = f_x*f_mul+(f_xscale-this._xscale)*f_ratio;
                   // f_x는 결국 메뉴의 넓이를 결정해주는 변수인데요, f_x가 0이 되는 순간이 메뉴가 크기 변하는걸 멈추는 순간입니다. 마우스를 올리거나 내리는 순간에 f_xscale 값에 변화가 오고 위 수식에 의해 f_x의 값은 감소, 결국은 마우스 이벤트에 의해 결정된 스케일 값까지 f_x는 f_ration에 의해 서서히 변할 것입니다, 탄성력을 주기위해 f_x*f_mul이란 수식을 사용한거고요, 이 수식에 의해 f_x 값이 순간 엄청 커져서 뒤에 나오는 식을 넘어버리는 경우가 생기는데, 다시 괄호 안 수식에 의해 f_x는 음수를 갖고 메뉴는 다시 작아지며 다시 설정된 스케일 값보다 작아지게 되면 또 ㄷㅏ시 수식에 의해 커지게 되는 것이랍니다, 이러한 원리에 의해서 탄성이 생기다가 어느 순간 f_x값이 0에 가까워 진다면 메뉴의 크기가 일정한 것처럼 보이게 된답니다.
        f_y = f_y*f_mul+(f_yscale-this._yscale)*f_ratio;
                   // 위 내용과 y스케일인 점빼고는 같아요 '-')/;;

        this._xscale += f_x;  //메뉴의 가로크기를 f_x만큼 추가하여 설정,
        this._yscale += f_y;  //메뉴의 가로크기를 f_y만큼 추가하여 설정,;
}

--------복사용--------
onClipEvent (load) {
        f_xscale = 100;
        f_yscale = 100;
        f_x = 0;
        f_y = 0;
        f_mul = 0.7;
        f_ratio = 0.3;
    this._alpha=95;
}
onClipEvent (enterFrame) {
        f_x = f_x*f_mul+(f_xscale-this._xscale)*f_ratio;
        f_y = f_y*f_mul+(f_yscale-this._yscale)*f_ratio;

        this._xscale += f_x;
        this._yscale += f_y;
}
----------------------
tanmanu_2_2.gif

붙임 1. 소스 첨부했습니다.
번호 제목 글쓴이 날짜 조회 수
공지 공지 강좌를 올리기전 공지사항을 읽어주세요 [12] Eccen 2004.12.15 48031
35 [photoshop_6.0 기초강좌-13]_다각형 올가미 툴 활용하기 file rosun 2005.08.06 2135
34 [photoshop_6.0 기초강좌-01]_구성과 기능들 [3] file rosun 2005.08.06 2134
33 (포토샵 처음 사용하시는 분들을 위한) 2. 이미지 불러오기 [5] 예인 2002.11.01 2095
32 [photoshop_6.0 기초강좌-12]_올가미 툴 활용하기 [1] file rosun 2005.08.06 2073
31 [도트] 편지 봉투 만들기 [7] file (_*_) 2002.02.25 1956
30 [photoshop_6.0 기초강좌-17]_페인팅 툴 활용하기(에어 브러시 툴) file rosun 2005.08.07 1927
29 [photoshop_6.0 기초강좌-07]_원형 선택 영역 지정하기 및 선택영역 뒤집기 file rosun 2005.08.06 1897
28 [photoshop_6.0 기초강좌-08]_옵션 설정하여 선택하기 file rosun 2005.08.06 1888
27 Color Settings 의 RGB setup 창을 여시면... file 이용현 2002.07.17 1866
26 [photoshop_6.0 기초강좌-06]_정사각형 영역 및 전체영역 선택하기 file rosun 2005.08.06 1863
25 Crazytalk PRO 5 기본 얼굴 필터 윤선미320 2008.09.01 1825
24 [photoshop_6.0 기초강좌-11]_홑 행 선택 툴 활용하기 file rosun 2005.08.06 1820
23 [photoshop_6.0 기초강좌-10]_홑 열 선택 툴 활용하기 file rosun 2005.08.06 1797
22 바느질한 느낌의 로고디자인 file wwolf 2008.09.21 1779
21 양갈래 머리 소녀 그리기 1탄 file 곰비 2006.08.21 1588
20 포토샵강좌 - 별만들기 [1] file IamAndy 2007.07.11 1373
19 굿 웹 디자인 사이트들 링크 [11] 박성렬 2002.04.05 1305
18 킴스웹에듀 ~~ 플래시 강좌사이트 입니다. kim's 2007.07.30 1263
17 [PHOTOSHOP]금속성 문자 만들기 [6] file (_*_) 2002.02.21 1073
16 [동영상] 제5강 max 건축 인테리어 개요 인테리어뱅크 2006.04.11 1064