演示效果:
悬浮标签的作用大家可能都知道:起着解释说明的作用,我们在电脑的很多地方都可以看到,这回我们用flash来做一个悬浮标签。
step1:准备六个图标,把它们转换为button,实例名分别为b1,b2,b3,b4,b5,b6。
ok,现在我们来做标签:
用矩形工具画个无边框的矩形,颜色就选黄色吧,按F8转化为movieclip,实例名为cap。
双击进入编辑状态,新建一图层,接下来做一个动态文本框:width:100,heigth:15,颜色为黑色,实例名为desc,返回主影片。
step2:在主影片上新建一图层,放动作脚本:
b1.onRollOver=function(){
captionFN(true,"Button1",this);
this.onRollOut=function(){
captionFN(false);
};
};
b2.onRollOver=function(){
captionFN(true,"Button2",this);
this.onRollOut=function(){
captionFN(false);
};
};
b3.onRollOver=function(){
captionFN(true,"Button3",this);
this.onRollOut=function(){
captionFN(false);
};
};
b4.onRollOver=function(){
captionFN(true,"Button4",this);
this.onRollOut=function(){
captionFN(false);
};
};
b5.onRollOver=function(){
captionFN(true,"Button5",this);
this.onRollOut=function(){
captionFN(false);
};
};
b6.onRollOver=function(){
captionFN(true,"Button6",this);
this.onRollOut=function(){
captionFN(false);
};
};
captionFN=function(showCaption,captionText,bName){
if(showCaption){
_root.createEmptyMovieClip("hoverCaption",this.getNextHighestDepth());
cap.desc.text=captionText;
cap._width=7*cap.desc.text.length;
cap._alpha=75;
//
if((bName._width+bName._x+cap._width)>Stage.width){
xo=-2-cap._width;
yo=-17;
}else{
xo=2;
yo=-17;
}
hoverCaption.onEnterFrame=function(){
cap._x=_root._xmouse+xo;
cap._y=_root._ymouse+yo;
cap._visible=true;
};
}else{
deletehoverCaption.onEnterFrame;
cap._visible=false;
}
};
ok,ctr+enter