MouseEvent.CLICK Problem

Is there any reason why a MouseEvent.CLICK would affect only 1 of 5 items, whereas a MouseEvent.ROLL_OVER and MouseEvent.ROLL_OUT affect 5 of 5 items when each event listener is applied exactly the same way?

For some reason, of the 5 images I’ve imported, only the last image is able to be clicked and have click actions applied, yet it is able to receive the ROLL_OVER and ROLL_OUT messages. So that leaves me thoroughly confused.

Here is the code I’m using, I’d greatly appreciate your help —


import XMLManager;
import caurina.transitions.Tweener;
import MakeHand;

var images:XMLList;
var box:Sprite;
var boxes:Array = [];
var loadedImages:Number = 0;

var imageList:XMLManager = new XMLManager("images.xml");
imageList.addEventListener(Event.COMPLETE, formatXMLContent);
imageList.start();

function formatXMLContent(event:Event):void {
    images = imageList.xmlContent.images.image;
    
    for (var i:uint = 0; i < images.length(); i++) {
        var loadedImages:Number = 0;
        var loader:Loader = new Loader();
        var urlRequest:URLRequest = new URLRequest(images*);
        
        box = new Sprite();
        box.graphics.beginFill(0xFFFFFF, 0);
        box.graphics.drawRect(-50, -50, 125, 195);
        box.graphics.endFill();
        box.x = i * box.width; box.y = 150;
        **box.addEventListener(MouseEvent.CLICK, clickOn);
        box.addEventListener(MouseEvent.ROLL_OVER, rollOn);
        box.addEventListener(MouseEvent.ROLL_OUT, rollOff);**
        addChild(box);
        
        // trace(getChildIndex(box)); // 0, 1, 2, 3, 4
        
        boxes.push(box);
        boxes*.x += stage.stageWidth / 6;
        loader.load(urlRequest);
        loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imageLoaded);
    }
}

function imageLoaded(e:Event):void {
    var image:Bitmap = (Bitmap)(e.target.content);
    image.x = -50;
    image.y = -50;
    var holder:Sprite = boxes[loadedImages];
    holder.addChild(image);
    loadedImages++;
}

function **clickOn**(e:Event):void {
    setChildIndex(e.target as Sprite, numChildren - 1); 
    Tweener.addTween(e.target, {scaleY: 1.5, scaleX: 1.5, time: .4, transition: "easeOutExpo"});
    box.removeEventListener(MouseEvent.ROLL_OVER, rollOn);
    box.removeEventListener(MouseEvent.ROLL_OUT, rollOff);
}

function **rollOn**(e:Event):void {
    setChildIndex(e.target as Sprite, numChildren - 1); 
    Tweener.addTween(e.target, {scaleY: 1.5, scaleX: 1.5, time: .4, transition: "easeOutExpo"});
}

function **rollOff**(e:Event):void {
    Tweener.addTween(e.target, {scaleY: 1, scaleX: 1, time: .3, transition:"easeOutExpo"});
}

I left the code somewhat full as the problem could be anywhere! I just don’t get it.

Thanks -