Hello All,
I’m creating a gallery and using an XML file to store the data (real original right?). So, I’m loading in different images and giving them a name when they load into flash. I want the images to be interactive. I can target these by getChildByName and applying an event listener. But, this isn’t very practical. I’d like to have one eventListener and one function that changes depending on which image is clicked.
e.g. The clicked image becomes larger and the rest of the images drop below.
or maybe there is a way of generating functions. So, every time an images is added flash creates a new function and eventListener assigned to that image.
If anyone could help me out with achieving this goal I’d really appreciate it.
Thanks
Leverage AS3 Event Propagation:
[LIST=1]
[]Wrap all of your image movieclips within a parent movieclip.
[]Create an event listener for the parent movieclip.
[*]Use event.target in your functions.
[/LIST]
GL
Thanks for the response snickelfritz. I’ve tried using event.target, but the problem is I can only target the image i click or roll over. So, I want the image I click on to become larger and the other images (independently) to animate to another location.
This works, but doesn’t give me the effect I’d like.
parentMC.y = stage.stageHeight;
targetMC.y = -stage.stageHeight;
I’m sure there is a better way of doing this.
Thanks again.
Try creating an if statement that contains tweening functions for multiple objects.
stop();
import gs.TweenMax;
import fl.motion.easing.*;
var targetIMG:String = "";
parent1.addEventListener(MouseEvent.MOUSE_OVER, rollover, false, 0, true);
parent1.addEventListener(MouseEvent.MOUSE_OUT, rollout, false, 0, true);
function rollover(event:MouseEvent):void {
targetIMG = event.target.name;
trace(targetIMG);
if (targetIMG == "img1") {
TweenMax.to(firstObject, 1, {x:0});
TweenMax.to(secondObject, 1, {x:100});
TweenMax.to(thirdObject, 1, {x:300});
} else if (targetIMG == "img2") {
targetIMG = event.target.name;
TweenMax.to(firstObject, 1, {x:300});
TweenMax.to(secondObject, 1, {x:0});
TweenMax.to(thirdObject, 1, {x:100});
}
}
function rollout(event:MouseEvent):void {
TweenMax.allTo([firstObject, secondObject, thirdObject], 1, {x:0, y:0});
}
Thanks man. That works great. I appreciate all the help.
Glad I could be helpful.
GL