<?xml version="1.0" encoding="utf-8"?>
<!-- Simple example to demonstrate the Zoom effect. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[        
            import flash.events.MouseEvent;
        
            public function doZoom(event:MouseEvent):void {
                if (zoomAll.isPlaying) {
                    zoomAll.reverse();
                }
                else {
                    // If this is a ROLL_OUT event, play the effect backwards. 
                    // If this is a ROLL_OVER event, play the effect forwards.
                    zoomAll.play([event.target], event.type == MouseEvent.ROLL_OUT ? true : false);
                }
            }
        ]]>    
    </mx:Script>

    <mx:Zoom id="zoomAll" zoomWidthTo="1" zoomHeightTo="1" zoomWidthFrom=".5" zoomHeightFrom=".5"  />
    
    <mx:Panel title="Zoom Effect Example" width="95%" height="95%" horizontalAlign="center"
        paddingTop="5" paddingLeft="10" paddingRight="10" paddingBottom="5">

        <mx:Text width="100%" color="blue"
            text="Move the mouse over the image to enlarge it. Move the mouse off of the image to shrink it."/>

        <mx:Image id="img"
            source="@Embed(source='assets/Nokia_6630.png')"
            scaleX=".5" scaleY=".5"
            rollOver="doZoom(event)"
            rollOut="doZoom(event)"/>

    </mx:Panel>
</mx:Application>