最新更新 sitemap 设计搜素
网页设计
国外网站 韩国网站 个人主页 手提袋设计 CSS 网页特效 平面设计 网站设计 Flash CMS技巧 服装网站 php教程 photoshop 画册 服务器选用 数据库 Office
网上家居 虚拟主机 域名注册 云主机 网页设计 客服QQ:8208442
当前位置:首页 > 网络设计学院 > Flash教程

Flash趣味鼠标特效技巧汇总

日期:10-18    来源:中国设计秀    作者:cnwebshow.com

从很早的版本开始,利用Flash就可以制作很多有趣的鼠标特效,下面我们来重温一下,制作几个有趣的鼠标特效。 c7C中国设计秀
c7C中国设计秀
一、实现原理 c7C中国设计秀
c7C中国设计秀
  其实鼠标特效的原理都是大同小异的,让Clip先停在某一帧上面,当鼠标滑过的时候,播放相应的特效。一个Clip看起来不怎么好看,但几十个Clip放在场景中,靠规模制胜,鼠标触发播放相应的效果,看起来就颇为壮观了。 c7C中国设计秀
c7C中国设计秀
  下面我们就来实现三个不同的实例,每一个实例都代表着一种类型的鼠标特效。 c7C中国设计秀
c7C中国设计秀
二、实例1 c7C中国设计秀
c7C中国设计秀
  这个实例实现的是有关线变换的鼠标特效,与线的变换有关的鼠标特效都与这个实例差不多。 c7C中国设计秀
效果预览 :c7C中国设计秀

http://myarticle.enet.com.cn/images/200405/1085559006476.swfc7C中国设计秀

1、新建一个场景,用“Ctrl + F8”新建一个Movie Clip,命名为“line elem”,在此Clip的场景中用绘线工具画一条直线。 c7C中国设计秀
c7C中国设计秀
  2、用“Ctrl + F8”新建一个Movie Clip,命名为“line elem 2”,在此Clip的场景中用矩形工具拉一个小的矩形,适当调整矩形的颜色。 c7C中国设计秀
c7C中国设计秀
  3、用“Ctrl + F8”新建一个Movie Clip,命名为“line”,在此Clip的时间轴的第二帧上单击鼠标右键,选择插入空白关键帧,将第一步中制作的Clip “line elem”拖到第二帧的场景中,并在第二帧的Action面板上面增加如下语句: c7C中国设计秀
c7C中国设计秀
stop(); c7C中国设计秀
c7C中国设计秀
  4、在“line”Clip的时间轴的第三帧上单击鼠标右键,选择插入空白关键帧,将第二步中制作的Clip “line elem 2”拖到第三帧的场景中,选取场景中的“line elem 2”,在其属性面板中设置alpha为“48%”。在“line”Clip的时间轴的第五十帧上单击鼠标右键,选择插入关键帧。点击时间轴的第三帧,在其属性面板上面设置一个旋转的动画,如图1所示。在时间轴的第三帧的Action面板上面增加如下语句: c7C中国设计秀
c7C中国设计秀
 c7C中国设计秀

请添加描述c7C中国设计秀

c7C中国设计秀
c7C中国设计秀
                     图1 c7C中国设计秀
 c7C中国设计秀

 c7C中国设计秀

this.swapDepths(2); //注释1 c7C中国设计秀
c7C中国设计秀
  注释1:设置此Clip的实例的深度,以免在播放的时候遮挡了其他的实例。 c7C中国设计秀
c7C中国设计秀
  在时间轴的第五十帧的Action面板上面增加如下语句: c7C中国设计秀
gotoAndStop(2); //注释1 c7C中国设计秀
_level0[temp] = "0"; //注释2 c7C中国设计秀
this.swapDepths(1); //注释3 c7C中国设计秀
c7C中国设计秀
  注释1:特效播放完,重新回到原来的状态。 c7C中国设计秀
  注释2:设置主场景中的变量。 c7C中国设计秀
  注释3:重新设置此Clip的实例的深度,重新响应鼠标动作。 c7C中国设计秀
c7C中国设计秀
  5、回到影片的主场景中,从图库中拖二十个“line”Clip的实例到场景中,适当调整好它们的位置。将“line”Clip的第一个实例命名为“t1”,并在此Clip的Action面板上面增加如下语句: c7C中国设计秀
c7C中国设计秀
onClipEvent (load) { c7C中国设计秀
temp = "t1flag"; //注释1 c7C中国设计秀
} c7C中国设计秀
on (rollOver) { c7C中国设计秀
if (_root.t1flag == "0") { c7C中国设计秀
_root.t1.gotoAndPlay(2); //注释2 c7C中国设计秀
_root.t1flag = "1"; //注释3 c7C中国设计秀
} c7C中国设计秀
} c7C中国设计秀
c7C中国设计秀
  注释1:设置在Clip里面要用到的变量值。 c7C中国设计秀
  注释2:播放鼠标触发的动画效果。 c7C中国设计秀
  注释3:设置变量,播放的时候就不再响应鼠标动作。 c7C中国设计秀
  将“line”Clip的第二个实例命名为“t2”,并在此Clip的Action面板上面增加如下语句: c7C中国设计秀
c7C中国设计秀
onClipEvent (load) { c7C中国设计秀
temp = "t2flag"; c7C中国设计秀
} c7C中国设计秀
on (rollOver) { c7C中国设计秀
if (_root.t2flag == "0") { c7C中国设计秀
_root.t2.gotoAndPlay(2); c7C中国设计秀
_root.t2flag = "1"; c7C中国设计秀
} c7C中国设计秀
} c7C中国设计秀
将“line”Clip的第三个实例命名为“t3”,并在此Clip的Action面板上面增加如下语句: c7C中国设计秀
onClipEvent (load) { c7C中国设计秀
temp = "t3flag"; c7C中国设计秀
} c7C中国设计秀
on (rollOver) { c7C中国设计秀
if (_root.t3flag == "0") { c7C中国设计秀
_root.t3.gotoAndPlay(2); c7C中国设计秀
_root.t3flag = "1"; c7C中国设计秀
} c7C中国设计秀
} c7C中国设计秀
…… c7C中国设计秀
c7C中国设计秀
  依次类推,对其他的Clip也做相同的操作,注意更改命名和变量中涉及的实例编号c7C中国设计秀

 c7C中国设计秀

this.swapDepths(2); //注释1 c7C中国设计秀
c7C中国设计秀
  注释1:设置此Clip的实例的深度,以免在播放的时候遮挡了其他的实例。 c7C中国设计秀
c7C中国设计秀
  在时间轴的第五十帧的Action面板上面增加如下语句: c7C中国设计秀
gotoAndStop(2); //注释1 c7C中国设计秀
_level0[temp] = "0"; //注释2 c7C中国设计秀
this.swapDepths(1); //注释3 c7C中国设计秀
c7C中国设计秀
  注释1:特效播放完,重新回到原来的状态。 c7C中国设计秀
  注释2:设置主场景中的变量。 c7C中国设计秀
  注释3:重新设置此Clip的实例的深度,重新响应鼠标动作。 c7C中国设计秀
c7C中国设计秀
  5、回到影片的主场景中,从图库中拖二十个“line”Clip的实例到场景中,适当调整好它们的位置。将“line”Clip的第一个实例命名为“t1”,并在此Clip的Action面板上面增加如下语句: c7C中国设计秀
c7C中国设计秀
onClipEvent (load) { c7C中国设计秀
temp = "t1flag"; //注释1 c7C中国设计秀
} c7C中国设计秀
on (rollOver) { c7C中国设计秀
if (_root.t1flag == "0") { c7C中国设计秀
_root.t1.gotoAndPlay(2); //注释2 c7C中国设计秀
_root.t1flag = "1"; //注释3 c7C中国设计秀
} c7C中国设计秀
} c7C中国设计秀
c7C中国设计秀
  注释1:设置在Clip里面要用到的变量值。 c7C中国设计秀
  注释2:播放鼠标触发的动画效果。 c7C中国设计秀
  注释3:设置变量,播放的时候就不再响应鼠标动作。 c7C中国设计秀
  将“line”Clip的第二个实例命名为“t2”,并在此Clip的Action面板上面增加如下语句: c7C中国设计秀
c7C中国设计秀
onClipEvent (load) { c7C中国设计秀
temp = "t2flag"; c7C中国设计秀
} c7C中国设计秀
on (rollOver) { c7C中国设计秀
if (_root.t2flag == "0") { c7C中国设计秀
_root.t2.gotoAndPlay(2); c7C中国设计秀
_root.t2flag = "1"; c7C中国设计秀
} c7C中国设计秀
} c7C中国设计秀
将“line”Clip的第三个实例命名为“t3”,并在此Clip的Action面板上面增加如下语句: c7C中国设计秀
onClipEvent (load) { c7C中国设计秀
temp = "t3flag"; c7C中国设计秀
} c7C中国设计秀
on (rollOver) { c7C中国设计秀
if (_root.t3flag == "0") { c7C中国设计秀
_root.t3.gotoAndPlay(2); c7C中国设计秀
_root.t3flag = "1"; c7C中国设计秀
} c7C中国设计秀
} c7C中国设计秀
…… c7C中国设计秀
c7C中国设计秀
  依次类推,对其他的Clip也做相同的操作,注意更改命名和变量中涉及的实例编号c7C中国设计秀

1、新建一个场景,用“Ctrl + F8”新建一个Movie Clip,命名为“arc1”,在此Clip的场景中用椭圆工具绘制一个椭圆,并向其中填充颜色。 c7C中国设计秀
c7C中国设计秀
  2、用“Ctrl + F8”新建一个Movie Clip,命名为“arc”,将上一步中所制作的“arc1”Clip拖到此Clip的场景中,在时间轴的第一帧的Action面板上面增加如下语句: c7C中国设计秀
c7C中国设计秀
this._x = random(500); //注释1 c7C中国设计秀
this._y = random(600); //注释2 c7C中国设计秀
this._rotation = random(360); //注释3 c7C中国设计秀
c7C中国设计秀
  注释1:this代表的是此Clip,这个语句是设置Clip的x坐标为随机值。 c7C中国设计秀
  注释2:设置Clip的y坐标为随机值。 c7C中国设计秀
  注释3:设置Clip的旋转方向为随机值c7C中国设计秀

3、在“arc”Clip的第八帧上面插入关键帧,并在帧的Action面板上面增加如下语句: c7C中国设计秀
stop(); c7C中国设计秀
c7C中国设计秀
  4、在“arc”Clip的第二十帧上面插入关键帧,将场景中的“arc1”Clip向右边移动一段距离。在此Clip的第八帧的属性面板上面设置一个动画效果,如图2所示。在此Clip的时间轴的第二十帧的Action面板上面增加如下语句: c7C中国设计秀
c7C中国设计秀
 c7C中国设计秀

请添加描述c7C中国设计秀

c7C中国设计秀
c7C中国设计秀
                       图2 c7C中国设计秀
c7C中国设计秀
gotoAndPlay(1); c7C中国设计秀
c7C中国设计秀
  5、回到影片的主场景中,在时间轴的第一帧上面增加如下语句: c7C中国设计秀
stop(); c7C中国设计秀
c7C中国设计秀
  6、将“arc”Clip拖到场景中,并在Clip的Action面板上面增加如下语句: c7C中国设计秀
on (rollOver) { c7C中国设计秀
this.gotoAndPlay(9); c7C中国设计秀
} c7C中国设计秀
c7C中国设计秀
  7、选取场景中的“arc”Clip,不断的“Ctrl + C”和“Ctrl + V”,复制许多实例出来,使效果看起来比较壮观。 c7C中国设计秀
c7C中国设计秀
  8、实例的制作到此完成,按“Ctrl + Enter”可以看到效果。 c7C中国设计秀
c7C中国设计秀
四、实例3 c7C中国设计秀
c7C中国设计秀
  这个实例实现的是有关背景效果的鼠标特效,与背景相关的鼠标特效,跟本实例的制作都大同小异。 c7C中国设计秀
c7C中国设计秀
 c7C中国设计秀

1、新建一个场景,用“Ctrl + F8”新建一个Graphic,命名为“Tween 7”,在此Clip的场景中用椭圆工具绘制一个圆,并向其中填充颜色为淡黄色。 c7C中国设计秀
c7C中国设计秀
  2、用“Ctrl + F8”新建一个Movie Clip,命名为“object”,在此Clip的第一帧的Action面板上面增加如下语句: c7C中国设计秀
stop(); c7C中国设计秀
c7C中国设计秀
  3、用鼠标右键单击“object”Clip中时间轴的第二帧,选取插入一个空白关键帧,第上一步中所制作的“Tween 7”Clip拖到此帧的场景中,选取场景中的“Tween 7”Clip,在其属性面板上面设置参数如图3所示。 c7C中国设计秀
c7C中国设计秀
请添加描述 c7C中国设计秀
c7C中国设计秀
                        图3 c7C中国设计秀
c7C中国设计秀
  4、用鼠标右键单击“object”Clip中时间轴的第十五帧,选取插入一个关键帧,选取此帧场景中的“Tween 7”Clip,在其属性面板上面设置参数如图4所示。 c7C中国设计秀
c7C中国设计秀
请添加描述 c7C中国设计秀
c7C中国设计秀
                        图4 c7C中国设计秀
c7C中国设计秀
  5、用鼠标右键单击“object”Clip中时间轴的第三十帧,选取插入一个关键帧,选取此帧场景中的“Tween 7”Clip,在其属性面板上面设置参数如图5所示。 c7C中国设计秀
c7C中国设计秀
请添加描述 c7C中国设计秀
c7C中国设计秀
                        图5 c7C中国设计秀
c7C中国设计秀
  6、用鼠标右键单击“object”Clip中时间轴的第四十五帧,选取插入一个关键帧,选取此帧场景中的“Tween 7”Clip,