A simple photo gallery using Array and looping functionality.

Creating a slide-show is best practice for learn Array,
condition and looping structure. If you are familiar with all those
then you can do so many thing, inside action script.

This project is very straight-forward. I am creating a series of thumbnail images for the click event and another series of large image to display to the main content area. Very beginning I am hiding all the large images using a property called visible. And I am storing all the thumb images and the large images instance name inside two array called "imageArray" and "thumbArray". And I am looping inside the array using for loop statement.

This is a very simple example, If you are having little bit of AS 3.0 knowledge.
So, Hope you will get this post helpful. Feel free to copy the code for your experiment and have fun.
Example:


Source sode :

import flash.events.MouseEvent;

var imageArray:Array = [one_mc,two_mc,three_mc,four_mc,five_mc,six_mc,seven_mc];
var thumbArray:Array = [thumbOne_mc, thumbTwo_mc, thumbThree_mc, thumbFour_mc, thumbFive_mc,
thumbSix_mc, thumbSeven_mc];

//This for loop is for the mouse event.
//If you are repeating one type of function again and again, then
//loop structure is the right choice. So, you can easily itirate each of then very easily.

for (var i:Number = 0; i < thumbArray.length; i++) {
thumbArray[i].addEventListener(MouseEvent.ROLL_OVER, onOver);
thumbArray[i].addEventListener(MouseEvent.ROLL_OUT, onOut);
thumbArray[i].addEventListener(MouseEvent.CLICK, onClick);
thumbArray[i].mouseChildren = false;
}

function onOver(evt:MouseEvent):void {
evt.target.gotoAndPlay("rollOver");
evt.target.buttonMode = true;
}

function onOut(evt:MouseEvent):void {
evt.target.gotoAndPlay("rollOut");
}

function onClick(evt:MouseEvent):void {

clearPhotos();

var count:Number = thumbArray.length;
var index:Number;

for (var i:Number = 0; i < count; i++) {
if (evt.target.name == thumbArray[i].name) {
index = i;
}
}
imageArray[index].visible = true;
}

//This function is to clear all photo, when the movie will start.
function clearPhotos():void {
one_mc.visible = false;
two_mc.visible = false;
three_mc.visible = false;
four_mc.visible = false;
five_mc.visible = false;
six_mc.visible = false;
seven_mc.visible = false;
}
clearPhotos();