-
xml thumbnail gallery
Hi Everyone,
I'm loading two XML documents, one for the thumbnails and one for the pictures. Until now, everything loads fine on the screen, but I need a way to interact between the thumbnail and the full size picture, since both of them are inside of arrays, I was thinking to make something like this but I cannot make it work
if (thumbnailarray[i] is clicked){
show picturearray[i]
}
This is my code, everything is working until now, I just need to know how to create what I described above
Code:
// variables for both XML's
var loader2 = new URLLoader();
loader2.addEventListener(Event.COMPLETE, piclo)
loader2.load(new URLRequest("pics2.xml"));
var list:XMLList = new XMLList;
var listlenght:int = 0;
var imgloader2:Loader;
var rayita:Array = new Array();
var _mc:MovieClip = new MovieClip;
var xmlLoader:URLLoader = new URLLoader();
xmlLoader.addEventListener(Event.COMPLETE, xmlend);
xmlLoader.load(new URLRequest("pics.xml"));
var xmlList:XMLList;
var xmlLength:int = 0;
var imgArray:Array = new Array();
var imageLoader:Loader;
var imgHolder_mc:MovieClip;
var j:Number = 0;
var p:Number = 0;
var l:Object;
// first XML IS LOADED
function xmlend(event:Event){
XML.ignoreWhitespace = true;
var this_xml:XML = new XML(event.target.data);
xmlList = this_xml.children();
xmlLength = xmlList.length();
for (var i:int = 0; i<xmlLength; i++) {
imageLoader = new Loader();
imageLoader.load(new URLRequest(xmlList[i].text()));
imgHolder_mc = new MovieClip();
addChild(imgHolder_mc);
imgHolder_mc.x = 20 ;
imgHolder_mc.y = 15 + i*50;
imgHolder_mc.alpha = .4;
imgHolder_mc.addChild(imageLoader);
imgArray.push(imgHolder_mc);
imgArray[i].addEventListener(MouseEvent.MOUSE_OVER, mouseov)
imgArray[i].addEventListener(MouseEvent.MOUSE_OUT, mouseou)
imgArray[i].name = "ahora" + i
trace(imgArray[i].name);
//imgHolder_mc.name = "ahora" + (i + 2) ;
}
}
// second xml loaded
function piclo(event:Event){
var xml2_xml:XML = new XML(event.target.data);
list = xml2_xml.children();
listlenght = list.length();
for (var i:int = 0; i<listlenght; i++) {
_mc.name = "ahora" +i;
imgloader2 = new Loader();
imgloader2.load(new URLRequest(list[i].text()));
trace(_mc.name);
_mc = new MovieClip();
addChild(_mc);
imgloader2.contentLoaderInfo.addEventListener(Event.COMPLETE, ch)// add event to get width
rayita.push(_mc)
_mc.addChild(imgloader2);
_mc.alpha = 0;
}
}
function mouseov(event:MouseEvent){
event.target.alpha = 4;
}
function mouseou(event:MouseEvent){
event.target.alpha = 1 ;
}
function ch(event:Event):void// need to do this to get correct width
{
if (event.currentTarget.content.width > 400){
event.currentTarget.content.x = 140
event.currentTarget.content.y = 25
}else{
event.currentTarget.content.x = 250
event.currentTarget.content.y = 10
}
}
-
humbnail Problem
Hello
hello my action script can help u. u can write as on the top blank layer.
But i have problem in multi level thumbnail.
I m facing problem in XML and action script when i have to make a tree level gallery.
Means suppose i have to make a gallery for shirt builder, and it has 2 types of thumbnails like thumbnail for portion (front, back, collar) and other for fabrics.
i have made 1 thumbnail for front, back and collar and also the big image appear by clicking on thumbnail, but it is not working for 2nd thumbnail, for example for fabric.
on clicking on fabric thumbnail corresponding thumbnails and big image should also change.
http://www.brooksbrothers.com/select...lectshirts.tem
Please see the link, our company want to make this type of flash wit us, here all image comes from database, for this we are using XML.
we have finished right side panel, but when clicking on left side category right side pannel should also change, how can it will be possible.
can anyone help us.
please see the xml and let us tell where we have to make change
<?xml version="1.0" encoding="iso-8859-1"?>
<gallary>
<image title="image 1" main="main/shirt_front.jpg" thmb="thumbnails/shirt1_front.jpg"/>
<image title="image 2" main="main/shirt_cuff.jpg" thmb="thumbnails/SHIRT1_CUFF.jpg"/>
<image title="image 3" main="main/shirt_collor.jpg" thmb="thumbnails/shirt1_collar.jpg"/>
<image title="image 4" main="main/shirt_back.jpg" thmb="thumbnails/shirt1_back.jpg"/>
</gallary>
And the flash for thumbnail is here:
loadMovie("main/shirt_front.jpg", "loader");
myPhoto = new XML();
myPhoto.ignoreWhite = true;
myPhoto.onLoad = function(success) {
//portfolioTag = this.firstChild;
numimages = this.firstChild.childNodes.length;
spacing = 95;
for (i=0; i<numimages; i++)
{
this.picHolder = this.firstChild.childNodes[i];
this.thumbHolder = thumbnails.createEmptyMovieClip("thumbnail"+i, i);
this.thumbHolder._x = i*spacing;
this.thumbLoader = this.thumbHolder.createEmptyMovieClip("thumbnail_i mage", 0);
this.thumbLoader.loadMovie(this.picHolder.attribut es.thmb);
this.thumbHolder.title = this.picHolder.attributes.title;
this.thumbHolder.main = this.picHolder.attributes.main;
this.thumbHolder.onRelease = function() {
loader.loadMovie(this.main);
title_txt.text = this.title;
};
}
};
myPhoto.load("XMLPhoto.xml");
this code is right only for one level xml and flash, but i need tree level.
can any one help? we are facing lots of problem.
thanks
Vijaylaxmi
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|