Is it possible to have a toggle button that has different font weights upon it's selected and over state?

All I've got to do is create a number of links that when pressed, stay highlighted -- and the highlight and over states just make the font bold. Sounds simple, right?

Well, I used a number of text areas like this:

        <mx:VBox id="vbox" left="10" verticalCenter="0" verticalGap="3" >
<mx:Text id="b0" text="What it is" click="{pages.selectedIndex=1; switchIt(0);}" selectable="false" useHandCursor="true" buttonMode="true"/>
                <mx:Image source="@Embed(source='dots.png')" />
<mx:Text id="b1" text="Who it's for" click="{pages.selectedIndex=2; switchIt(1)}" selectable="false" mouseOut="{if(b1!=sel) {b1.styleName='infoLinks'}}" mouseOver="{b1.styleName='onLink'}" useHandCursor="true" buttonMode="true"/>
                <mx:Image source="@Embed(source='dots.png')" />
<mx:Text id="b2" text="What you do" click="{pages.selectedIndex=3; switchIt(2)}" selectable="false" mouseOut="{if(b2!=sel) {b2.styleName='infoLinks'}}" mouseOver="{b2.styleName='onLink'}" useHandCursor="true" buttonMode="true"/>
                <mx:Image source="@Embed(source='dots.png')" />
<mx:Text id="b3" text="What you gain" click="{pages.selectedIndex=4; switchIt(3)}" selectable="false" mouseOut="{if(b3!=sel) {b3.styleName='infoLinks'}}" mouseOver="{b3.styleName='onLink'}" useHandCursor="true" buttonMode="true"/>
        </mx:VBox>


Well the trouble is - I want to make the selected text to be 'on' - so I've been trying to set the selected text styleName to be the 'onLink' by calling it in the switchIt function -- but this doesn't seem to be working:

                        private function switchIt(num:Number):void{
                                for(var i:uint=0; i<4; i++){
                                        if(vbox['b'+i] == tBut){
                                                vbox['b'+i].styleName = 
"onLink";
                                                vbox['b'+i].mouseOver = "";
                                                vbox['b'+i].mouseOut = "";
                                        }else{
                                                vbox['b'+i].mouseOut = 
(vbox['b'+i].styleName = 'infoLinks');
                                                vbox['b'+i].mouseOver = 
(vbox['b'+i].styleName = 'onLink');
                                                vbox['b'+i].styleName = 
"infoLinks";
                                        }
                                }
                        }

But it doesn't seem like I can set the mouseOver/mouseOut on Text components?

Reply via email to