Hey folks. I’ll try to be as concise as possible.
Imagine a res. of about 320 x 480 for a Flash file in which art is displayed, but at the bottom of this .FLA there are 5 icons, 2 inside the white space and 3 on the grey space. What I’m trying to achieve is that if the mouse hovers near the bottom right corner of the screen, the 2 icons in the white space, get shifted left, allowing for the icons in the grey space to move left as well, taking up the palce of the icons in the white space. I’m basically trying to implement a scrolling animation. Let’s say in the bottom right and bottom left of this screen I have 2 invisible smaller screens that can listen for the MOUSE_OVER event, then I could perform the following code which is my current implementation:
// Showing implementation of only bottom right invisible screen, bottom left invisible screen
// is almost identical except when mouse hovers it the icons should all shift right
brScreen.addEventListener(MouseEvent.MOUSE_OVER, mouseOver);
brScreen.addEventListener(MouseEvent.ROLL_OVER, rollOver);
public function mouseOver(me:MouseEvent):void
{
var iconPosition:uint;
// All 5 icons on bottom of page are in array called myArray
for(int i:uint = 0; i <myArray.length; i++)
{
var currentIcon:DisplayObjectContainer = myArray*;
iconPosition = currentIcon.x; // Only the x position of the icons change when scrolling occurs
TweenLite.to(currentIcon, 2, {x:iconPosition - 50, y: 450, ease:Quart.easeIn}); // Assume libraries are imported
// y value of icon never changes since only side-to-side scroll, 450 is an arbitrary value
}
}
public function rollOut(me:MouseEvent):void
{
brScreen.removeEventListener(MouseEvent.MOUSE_OVER, mouseOver);
}
The desired behaviour is that as the mouse is hovered over near the bottom right screen, the icons will continue scrolling but as soon as the mouse is hovered off elsewhere, the side-to-side scrolling stops. The issue is that when I hover my mouse near the bottom right screen, all icons get shifted left only once, it seems as if the MOUSE_OVER event isn’t propagating while I’m hovering over the bottom right portion of the screen, additionally when I hover my mouse elsewhere and and then re-hover the bottom right portion of screen, all icons only get shifted to the left once. I want it to continuously shift all icons to the left as long as my mouse remains hovered above the bottom right portion of the screen.
If you have a hard time understanding what my desired behaviour is, here is a youtube vid., check at 25 - 40 seconds or so when he starts manipulating the icons at the bottom of the screen, instead of using fingers however for touch screen, I’m going to use a mouse since this is a Flash app. Any help is appreciated.
