Problem mit mouseOver Effekt

[ZeroEnna]

Hallo zusammen

Ich habe folgendes Problem mit dem mouseOver Effekt:

Ich habe ein Bild. Wenn man mit der Maus über dieses fährt, soll ein Kasten mit Informationen über dem Bild erscheinen. Sobald die Maus den Bildbereich verlässt, soll der Informationskasten verschwinden.
Das Problem hierbei ist, dass der Kasten schon verschwindet wenn man mit der Maus über ihn drüberfährt.

Ich habe euch mal ein Beispiel angehängt, welches das Problem verdeutlicht. Das rote Rechteck repräsentiert dabei das Bild und das grüne den Infokasten.

Könnt ihr mit sagen, wie ich es hinbekomme, dass der grüne Kasten erst dann verschwindet wenn die Maus der roten bereich verlässt?

Vielen Dank und Gruss
ZeroEnna

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="250" height="220">
    <mx:Script>
        <![CDATA[
            public function showHelp():void {
                
                this.help.visible = true;
                
            }
            
            public function hideHelp():void {
                
                this.help.visible = false;
                
            }
        ]]>
    </mx:Script>
    
    <mx:Fade id="fadeIn" alphaFrom="0" alphaTo="1" duration="1000"/>
    <mx:Fade id="fadeOut" alphaFrom="0" alphaTo="1" duration="500"/>
    
    <mx:Canvas backgroundColor="0xff0000" backgroundAlpha="1" mouseOver="showHelp()" mouseOut="hideHelp()" width="139" height="195" x="59" y="10">
        
    </mx:Canvas>
    <mx:Canvas backgroundColor="0x00ff00" backgroundAlpha="1" id="help" visible="false" width="189" height="128" x="23" y="50" showEffect="fadeIn" hideEffect="fadeOut">
            
    </mx:Canvas>
</mx:Application>