请问遮罩层如何用？或者这种应该如何实现

请教遮罩层怎么用？或者这种应该怎么实现？

现在有3层，最下层是那个长条，第二是红色部分，第一层是黑色字，怎么实现红色部分移动到黑色字部分字体变白色？
好像遮罩层能实现这效果，不会使啊，谁告诉个流程？昨天就纠结这个问题，一直没弄好，注意不是让字体变成白色，而是红色部分移动到上面的时候才变白，就好像让红色部分把黑色字体过滤成白色一样。我是应该在建个什么透明层什么的吗？刚接触FLASH。真心不会用什么滤镜遮罩层啊，请教大家怎么弄？？？？

[解决办法]
为什么那么麻烦，用按钮就轻松实现不是更好？
[解决办法]
这个效果太容易实现了。我给用纯代码写了一个。放在第一帧上。
其实还有很多可以调整的地方，我只是抛砖引玉。

JScript code

 
 import flash.text.TextField; 
 import flash.text.TextFieldAutoSize; 
 import flash.events.MouseEvent; 
 import flash.display.Sprite; 
  
 graphics.beginFill(0xffffff); 
 graphics.lineStyle(1,0xcccccc); 
 graphics.drawRoundRect(0,0,300,20,20,20); 
  
  
 var sprite:Sprite  = new Sprite(); 
 sprite.graphics.beginFill(0xff0000); 
 sprite.graphics.drawRoundRect(0,0,40,20,20,20); 
 addChild(sprite); 
 sprite.visible = false; 
  
 txts(30,0,"发型"); 
 txts(80,0,"头饰"); 
 txts(130,0,"发型"); 
 txts(180,0,"发型"); 
 function txts(X:int,Y:int,str:String) 
 { 
 var txt:TextField = new TextField(); 
 txt.selectable = false; 
 txt.autoSize = TextFieldAutoSize.CENTER; 
 txt.text = str; 
 txt.x = X; 
 txt.y = Y; 
 txt.addEventListener(MouseEvent.MOUSE_OVER,txtEvt); 
 txt.addEventListener(MouseEvent.MOUSE_OUT,txtEvt); 
 addChild(txt); 
 } 
  
 function txtEvt(e:MouseEvent) 
 { 
 if (e.type == MouseEvent.MOUSE_OVER) 
 { 
 sprite.visible = true; 
  
 sprite.x = e.target.x - 6; 
 sprite.y = e.target.y; 
 } 
 else 
 { 
 sprite.visible = false; 
 } 
 }