emma welles

http://www.massgeneral.org/cancer/
This project was a new challenge for me. MGH wanted to enhance the Flash animation I developed last year by including a video to play on page load, with controls hidden until the user’s cursor rolls over the video.

I coded their video players too, so I figured, piece of cake! WRONG. A few of my usual tricks for this kind of interaction failed me when any rollover of a button on the controls resulted in the whole menu slipping away right under my cursor. Seems calling “onRollOver” of one button also calls the “onRollOut” of another, even if they happen to be on top of each other. Eventually I settled on a cursor coordinates check that runs every frame and tests to see if the mouse is over the x & y bounds of the video. If so, and the menu isn’t already showing, call showMenu(), but if not, call hideMenu().

Some Actionscript2 code for you: (uses the awesome Tweener class)

function hideMenu(){
Tweener.addTween(videoHolder.menu, {_y:227, time:1, transition:”easeOutSine”});
hideVolume();
}

function showMenu(){
Tweener.addTween(videoHolder.menu, {_y:192, time:1, transition:”easeOutSine”});
}

function mouseTest(){
if (_xmouse > 400 && _xmouse 13 && _ymouse < 245){
if(!menuIsOpen){
showMenu();
menuIsOpen = true;
}
}
else{
if(menuIsOpen){
hideMenu();
menuIsOpen = false;
}
}
}
videoHolder.onEnterFrame = mouseTest;

As always, I welcome your more efficient solutions!!