I'm trying to create a slide effect. Everything works fine except when the hideEffect animation is shown for the first time. The content does not become invisible when crossing the TabNavigator's border, which looks really ugly in my current project.

The following simple example demonstrates the problem:

<?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"
                  backgroundColor="0xDDDDDD">

     <fx:Declarations>
          <s:Move id="hideEffect" xTo="700" />
     </fx:Declarations>

     <mx:TabNavigator width="500" height="300" x="100" y="0">

          <s:NavigatorContent label="ONE" hideEffect="{hideEffect}">
               <s:BorderContainer backgroundColor="0xFF0000" height="100" width="100"/>
          </s:NavigatorContent>

          <s:NavigatorContent label="TWO" hideEffect="{hideEffect}">
               <s:BorderContainer backgroundColor="0xFF0000" height="100" width="100"/>
          </s:NavigatorContent>

          <s:NavigatorContent label="THREE" hideEffect="{hideEffect}">
               <s:BorderContainer backgroundColor="0xFF0000" height="100" width="100"/>
          </s:NavigatorContent>

          <s:NavigatorContent label="FOUR" hideEffect="{hideEffect}">
               <s:BorderContainer backgroundColor="0xFF0000" height="100" width="100"/>
          </s:NavigatorContent>

     </mx:TabNavigator>

</s:Application>

Screenshot: hideEffectBug

Any ideas how to fix this bug?