Shaky Flash Menu Script
OK, so you love the little shaky menu on the experiments page? Well, for a step by step, go over to Flash My Mind. Below is just the Action Script. It’s commented really, REALLY well. If you have any particular questions, feel free to ask me.
Pretty much, the buttons are made up of several movie clips, those movie clips are grouped and passed into an array. Then we set the original coordinants and make our functions for click, over and out. Over runs the tween stuff, out stops it and click goes to an external URL. It’s all pretty simple really!
//Import TweenMax
import gs.*;
//This array will contain all the rectangles
var rectangles:Array = new Array();
//Loop through the items in this movie clip
for (var i:uint = 0; i < this.numChildren; i++) {
//Get an object
var object:* = this.getChildAt(i);
//Check to see if the object is a MenuRectangle
if (object is MenuRectangle) {
//Save the rectangle's coordinates (we need these later on)
object.origX = object.x;
object.origY = object.y;
//Add the rectangle to the rectangles array
rectangles.push(object);
}
}
//Add mouse listeners for the mouse area
mouseArea.addEventListener(MouseEvent.MOUSE_OVER, mouseOverHandler);
mouseArea.addEventListener(MouseEvent.MOUSE_OUT, mouseOutHandler);
mouseArea.addEventListener(MouseEvent.CLICK, itemClicked);
//This function is called when the cursor is over the mouse area
function mouseOverHandler(e:Event):void {
//Loop through the rectangle array
for (var i:uint = 0; i < rectangles.length; i++) {
//Assign the rectangle to a local variable
var rectangle:MenuRectangle = rectangles[i] as MenuRectangle;
//Calculate random target coordinates for the rectangle
var randomX:Number = rectangle.x + 10 * Math.cos(Math.random() * Math.PI * 2);
var randomY:Number = rectangle.y + 10 * Math.sin(Math.random() * Math.PI * 2);
//Animate the rectangle to the random coordinates
TweenMax.to(rectangle, 0.4, {x: randomX, y: randomY, alpha: 0.6, tint: Math.random() * 0xffffff});
}
//Add an ENTER_FRAME listener for the shake effect
addEventListener(Event.ENTER_FRAME, shake);
}
//This function is called when the cursor moves out of the mouse area
function mouseOutHandler(e:Event):void {
//Loop through the rectangle array
for (var i:uint = 0; i < rectangles.length; i++) {
//Assign the rectangle to a local variable
var rectangle:MenuRectangle = rectangles[i] as MenuRectangle;
//Tween the rectangle to the original position
TweenMax.to(rectangle, 0.4, {x: rectangle.origX, y: rectangle.origY, rotation: 0, alpha: 0.3, tint: 0xff8800});
}
//Remove the ENTER_FRAME listener (we don't want to shake the rectangle anymore)
removeEventListener(Event.ENTER_FRAME, shake);
}
//This function is called when the mouse area is clicked
function itemClicked(e:Event):void {
//Navigate to some URL
var urlRequest:URLRequest = new URLRequest("http://www.artfrickdesign.com/portfolio.html");
navigateToURL(urlRequest);
}
//This function is called in each frame
function shake(e:Event):void {
//Loop through the rectangles array
for (var i:uint = 0; i < rectangles.length; i++) {
//Assign the rectangle to a local variable
var rectangle:MenuRectangle = rectangles[i] as MenuRectangle;
//Rotate the rectangle a random amount (from -4 to 4)
rectangle.rotation += Math.random() * 8 - 4;
//Assign a new random position (from -4 to 4)
rectangle.x+=Math.random()*8-4;
rectangle.y+=Math.random()*8-4;
}
}
Recent Comments