제목이 좀 길고 거추장스러워 빨리 이해가 가지 않으시죠?^^
하지만 그림에 마우스를 가져대고 움직여 보면 금방 이해가 가실 겁니다.

macromotive.com의 Dan Alu가 공개한 소스인데 직접 만들어 보니 액션도 쉽고 재미있었습니다.
배경그림을 랜덤하게 가져오는 방법도 좋지만 마우스가 움직일 때마다 그림이 alpha값에 따라 서서히 바뀌는 배경 또한 방문객의 눈길을 끌 수 있을 것입니다. 아주 간단한 액션이니 여러분도 만들어 보세요.

[예제 - 알파값에 의해 서서히 바뀌는 배경 그림]



※마우스를 무비 위 아래로 움직여 보세요.

[따라하기]

우선 크기가 같은 이미지 5개가 필요합니다. 이미지 5개를 라이브러리로 임포트 한 후에 이미지를 무비클립으로 만들어 줍니다.

하나의 레이어에 이미지로 만든 무비클립을 갖다 놓습니다. 그리고 반드시 instance name을 주어야 합니다. 순서대로 img1, img2...img5 이렇게 주어 봅시다.

위의 그림 처럼 5개의 무비클립이 하나씩 레이어에 들어간 후에, 액션을 넣게 될 레이어를 추가합니다. 이때 img1이 들어간 레이어가 상위에 놓여야 합니다.

alpha값 변화에 따른 function을 수행할 이름만 있는 무비클립을 생성해서 라이브러리에 등록해 놓습니다. 이름을 script로 해 봅시다.

액션은 다음과 같이 넣어줍니다.

_root.createEmptyMovieClip("script", 0);
script.onLoad = function() {
        mosx = 0;
        mosy = 0;
};
script.onEnterFrame = function() {
         difx = mosx - _root._xmouse;

        dify = mosy - _root._ymouse;
        
        mosx -= difx / 8;

        mosy -= dify / 8;

        _root.img1._alpha = (mosx / 4) - (mosy / 4);

        _root.img2._alpha = 100 - (mosx / 4) - (mosy / 4);

        _root.img3._alpha = (mosy / 4) - 100 + (mosx / 4);

        _root.img4._alpha = (mosy / 4) - (mosx / 4);
};

마우스를 갖다 대었을 때 알파값의 변화를 4개의 무비클립에 각 각 주었습니다. 마우스를 떼었을 때, 변하지 않는 그림이 있어야 함으로 하나를 추가한 것입니다. difx / 8 과 dify / 8 은 변하게 하는 속도를 주게 되는데 숫자가 높을 수록 서서히 변하게 됩니다.

※무비 속 이미지들은 제 플래시 홈에서 사용되었던 것들입니다. 플래시 MX 완전 초보를 위한 강좌를 홈에 올리고 있습니다. →강좌이동