Creating a custom creation complete effect on a Flex Alert control

The following example shows how to specify a effect which gets played when an Alert control is displayed by setting the Alert control’s creationCompleteEffect style. You can also see how to embed both the normal and bold font using CSS and @font-face

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/10/12/creating-a-custom-creation-complete-effect-on-a-flex-alert-control/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:Style>
        @font-face {
            src: local("Verdana");
            fontFamily: VerdanaEmbedded;
        }

        @font-face {
            src: local("Verdana");
            fontFamily: VerdanaEmbedded;
            fontWeight: bold;
        }

        Alert {
            fontFamily: VerdanaEmbedded;
            creationCompleteEffect: myEffect;
        }
    </mx:Style>

    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;

            private var alert:Alert;

            private function button_click():void {
                alert = Alert.show("The quick brown fox jumped over the lazy dog", "Lorem Ipsum");
            }
        ]]>
    </mx:Script>

    <mx:Sequence id="myEffect">
        <mx:Parallel>
            <mx:Zoom />
            <mx:Fade />
        </mx:Parallel>
        <mx:Rotate />
    </mx:Sequence>

    <mx:Button label="Launch Alert" click="button_click();" />

</mx:Application>