Inconsistent Flex Effects - apache-flex

Question

I've created a simple effect in Flex, code below, but it does not execute correctly... When I rollOver the icon, MOST of the time the effect plays, and when I rollOut of the image the effect should play in reverse, but rarely does...
Is my code or logic incorrect? FYI - I'm using Flash Builder 4.6.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<s:Move id="detail_fade" target="{detail_panel}" xFrom="218" xTo="400" />
</fx:Declarations>
<s:Panel id="detail_panel" x="218" y="10" width="728" height="580" title="something">
</s:Panel>
<s:VGroup x="7" y="5" width="200" height="200">
<s:Image source="images/Airfield Icon.jpg"
rollOver="detail_fade.play()" rollOut="detail_fade.reverse()"/>
</s:VGroup>

Answer 1

As Mahesh pointed out in his comment, reverse() will only reverse an effect that is actually playing. Which is why you only see it happening sometimes: i.e. when you're quick enough to roll_out before the effect has ended.
You should instead use:
detail_fade.play(null, true);
The first argument of the play method, is an Array of the targets of your effect. Since you've already given it a target, you don't need to pass it again (that's why it says null).
The second argument is a Boolean telling the effect to play in the inverse direction if set to true. It is of course false by default.
Now, you may notice that when you roll_out quickly, the effect will jump to the end and start playing in the other direction from there.
This can be fixed like so:
if (detail_fade.isPlaying) detail_fade.reverse();
else detail_fade.play(null, true);