XML Image Gallery with World Style
| Category | : Flash | Views | : 38997 | ||
| Version | : 8 | Rating | : | ||
| Type | : Text | Source File | : xml-image-gallery-with-world-style.zip | ||
| Result | : See the result | ||||
In this gallery you move all image with the mouse and when you roll over one image it will enlarge.
First create a new MC to use as a frame for the pictures:
The rectangle inside the frame on my MC has the size "200x150", if yours is different just remember the number because we are going to use it.
Drag an instance of this MC to the stage and name it, "frame".
Now create an XML file with the paths to the images, like this:
<xml>
<images>
<image1 title = "1.jpg" />
<image2 title = "2.jpg" />
<image3 title = "3.jpg" />
<image4 title = "4.jpg" />
</images>
</xml>
Take some images and copy their paths to the attribute "title" of any node.
Let's start the code by loading the paths from the XML:
//Import two libraries that we are going to use for the images loaded
import flash.display.BitmapData;
import flash.geom.Matrix
//Load the XML file, "images.xml"
var image_xml = new XML();
image_xml.ignoreWhite = true;
image_xml.load("images.xml")
//Array for the paths of the images
var images_path = new Array();
//Variable to give unique names to MCs
var frames = 0
//When the XML loaded
image_xml.onLoad = function()
{
//Loop through each node
for(i = 0; i < image_xml.firstChild.firstChild.childNodes.length; i++)
{
//Get path
_root.images_path[i] = image_xml.firstChild.firstChild.childNodes[i].attributes.title;
//Create MC for the image
_root.createEmptyMovieClip("frames" + i, _root.getNextHighestDepth());
//Load the image
_root.MCloader.loadClip(_root.images_path[i], _root["frames" + i]);
}
}
Above we use and object called MCloader to load the images, it is a MovieClipLoader object that we are going to use to load all images and to get exactly when the image is loaded.
 |
 |
 |
 |
 |
Video tutorial: Forex trading
Sponsors
