演示效果:
悬浮标签的作用大家可能都知道:起着解释说明的作用,我们在电脑的很多地方都可以看到,这回我们用flash来做一个悬浮标签。
step1:准备六个图标,把它们转换为button,实例名分别为b1,b2,b3,b4,b5,b6。
ok,现在我们来做标签:
用矩形工具画个无边框的矩形,颜色就选黄色吧,按F8转化为movie clip,实例名为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 {
delete hoverCaption.onEnterFrame;
cap._visible = false;
}
};
ok,ctr+enter