I’ve been seeing a lot of Flash sites lately that have the background that moves as your mouse moves. It’s a pretty cool effect. The objects in the background move less and the objects in the foreground move more. It almost gives the site a 3D feel.

Anyway - I thought I’d jump into Flash and try to figure out how it’s done. It was actually a LOT easier than I thought it would be (Disclaimer: This is AS2 not AS3).

You can see our finished file here.

The code is explained below, or if you want to jump right to the finished product download the source.

Instructions

The first thing you need to do is start an onEnterFrame function which basically continually checks to see what is going on in your Flash:

this.onEnterFrame = function(){

}

Subtracting the x and y mouse positions from the width and height of the Stage will give us the effect of the background moving opposite from the mouse:

this.onEnterFrame = function(){
cursorX = Stage.width - _xmouse;
cursorY = Stage.height - _ymouse;

}

Now all we need to do is create some movie clips, give them instance names and tie their movement to the cursorX and cursorY variables we created:

this.onEnterFrame = function(){
cursorX = Stage.width - _xmouse;
cursorY = Stage.height - _ymouse;

}

You can play with the math and see how it affects the movement of your movie clips to get that 3D effect. Good luck!