To remove the highlight when the mouse moves away from both text fields, we would first register both text fields to receive the MouseEvent.MOUSE_OUT event : MouseEvent « TextField « Flash / Flex / ActionScript






To remove the highlight when the mouse moves away from both text fields, we would first register both text fields to receive the MouseEvent.MOUSE_OUT event

 
package {
  import flash.display.*;
  import flash.text.*;
  import flash.events.*;

  public class WordHighlighter extends Sprite {
    private var word1:Sprite;
    private var text1:TextField;

    private var word2:Sprite;
    private var text2:TextField;

    private var bgRect:Shape;

    public function WordHighlighter (  ) {
      word1 = new Sprite(  );
      text1 = new TextField(  );
      text1.text = "Products";
      text1.selectable = false;
      text1.autoSize = TextFieldAutoSize.LEFT;
      word1.addChild(text1)
      text1.addEventListener(MouseEvent.MOUSE_OUT, mouseOutListener);

      word2 = new Sprite(  );
      text2 = new TextField(  );
      text2.text = "Services";
      text2.selectable = false;
      text2.autoSize = TextFieldAutoSize.LEFT;
      word2.x = 75;
      word2.addChild(text2)
      text2.addEventListener(MouseEvent.MOUSE_OUT, mouseOutListener);

      addChild(word1);
      addChild(word2);

      bgRect = new Shape(  );
      bgRect.graphics.lineStyle(1);
      bgRect.graphics.beginFill(0xCCCCCC, 1);
      bgRect.graphics.drawRoundRect(0, 0, 60, 15, 8);
      
    }


    private function mouseOutListener (e:MouseEvent):void {
      // If the highlight is present...
      if (e.target.parent.contains(bgRect)) {
        // ...remove it
        e.target.parent.removeChild(bgRect);
      }
    }
  }
}

        








Related examples in the same category

1.Add mouse click listener to TextField
2.Disappearing TextField
3.Working with Advanced Text Layout
4.Highlight a paragraph when the user clicks a character
5.Drag and drop text
6.Clickable TextField
7.Using multiLine and TextMetrics: set the characters in the line underneath the user's mouse to red.
8.Unicode characters