How to change background images in s:application

Question

hello!
i want to make a webside by flex4 as  this web http://www.templatemonster.com/flash-cms-templates/29930.html
But i don't know how to make change background images by click and make sound when load page.
Can u help me ,please. sorry i write E not well.
Thanks so much
BUI THI PHUONG THANH- FROM VIETNAM

Answer 1

Hi,
please create a sink for your application inside that put your image.And apply that skin to your application on any click.
Below is the code.
Main Application
<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/halo" xmlns:mx1="library://ns.adobe.com/flex/mx">
    <fx:Script>
        <![CDATA[
            protected function btn_click(evt:MouseEvent):void {
                this.setStyle("skinClass", MySkinClass);
        ]]>
    </fx:Script>
    <s:Button label="Change BackGroundImage" click="btn_click(event);"/>
</s:Application>
MySkinClass
<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:mx="library://ns.adobe.com/flex/mx">
    <!-- host component -->
    <fx:Metadata>
        [HostComponent("spark.components.supportClasses.SkinnableComponent")]
    </fx:Metadata>
    <s:states>
        <s:State name="normal" />
        <s:State name="disabled" />
    </s:states>
    <s:BitmapImage source="@Embed('image1.jpg')"  smooth="true" left="0" right="0"  top="0" bottom="0"  />
</s:Skin>
with Regards,
Shardul Singh Bartwal