The following code is solution to a problem where you need to make the accordion component’s MouseOver event to behave like a click event. The code will work only in the case if you have not given the names to the AccordionHeader explicitly. Check the solution out here
<?xml version=”1.0″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml”>
<mx:Script>
<![CDATA[
public function onMouseOver(evt:MouseEvent):void{
var strName:String = evt.target.name;
var strLen:int = String("_header").length;
if(strName.indexOf("_header") > -1){
accordion.selectedIndex = int(strName.substr(strLen,strName.length));
}
}
]]>
</mx:Script>
<mx:Panel title=”Accordion Container Example” height=”90%” width=”90%”
paddingTop=”10″ paddingLeft=”10″ paddingRight=”10″ paddingBottom=”10″>
<mx:Label width=”100%” color=”blue”
text=”Select an Accordion navigator button to change the panel.”/>
<mx:Accordion id=”accordion” width=”100%” height=”100%” mouseOver=”onMouseOver(event)” >
<!– Define each panel using a VBox container. –>
<mx:VBox label=”Accordion Button for Panel 1″>
<mx:Label text=”Accordion container panel 1″/>
</mx:VBox>
<mx:VBox label=”Accordion Button for Panel 2″>
<mx:Label text=”Accordion container panel 2″/>
</mx:VBox>
<mx:VBox label=”Accordion Button for Panel 3″>
<mx:Label text=”Accordion container panel 3″/>
</mx:VBox>
</mx:Accordion>
<mx:Label width=”100%” color=”blue”
text=”Programmatically select the panel using a Button control.”/>
<mx:HBox>
<mx:Button label=”Select Panel 1″ click=”accordion.selectedIndex=0;”/>
<mx:Button label=”Select Panel 2″ click=”accordion.selectedIndex=1;”/>
<mx:Button label=”Select Panel 3″ click=”accordion.selectedIndex=2;”/>
</mx:HBox>
</mx:Panel>
</mx:Application>
