Flash好看的跟随鼠标的旋转星星

核心提示:Flash好看的跟随鼠标的旋转星星制作教程。

第一步:

打开FLASH,新建一个影片剪辑元件,命名为“星星”,在里面绘制一个星星出来,并且把它的中心点和舞台注册点对齐,在第20帧和第40处各插入一个关键帧。选中第20帧,在它的中心点和舞台的注册点对齐的情况下按住SHIFT键进行等比例缩小(你认为差不多就行了),然后选中第1到20帧的任意一帧创建补间动画,打开属性面板把它的转调成逆时针,选中第20到40帧的任意一帧创建补间动画,打开属性面板把它的转调成顺时针。

第二步:

在新建一个影片剪辑元件,命名为“转圈的星星”,在图层面板的地方找到“添加运动引导层”添加一个引导层出来,在选中该图层的情况下按住AIT+SHIFT键在舞台上绘制一个有边框无填充色的圆(大小你认为合适就OK),然后用鼠标圈住它的一点边选中后删除(这样做是给它一缺口),选中绘制好的圆,把它的左和上对齐舞台中心的注册点,选中第40帧处添加一个帧,锁定该图层,选择第一个图层把我们库中的星星拖进来并把它的中心点对齐引导层中圆的上边的那个缺口的地方,选中第四十帧插入一个关键帧把它的中心点对齐引导层中圆的下边的那个缺口的地方。回到舞台,把库中转圈的星星放到舞台任意位置,并给它一个实例名称mc。

第三步:

继续插入一个影片剪辑元件,命名为“as",选中第一帧添加以下代码:

var k:Number=64;//用来定义星星的个数;

var n:Number=16;//用来定义一圈星星的个数;

var r:Number=2;X坐标和Y坐标的缓动,值越大跟随鼠标移动时就越慢;

for(var i=1;i<=k;i++){

duplicateMovieClip("_root.mc","mc"+i,i);

setProperty("_root.mc"+i,_rotation,360/n*i);

setProperty("_root.mc"+i,_alpha,100/k*i);

}

setProperty(_root.mc,_visible,0);

选中第二帧处插入一个空白关键帧添加以下代码:

for(var j=1;j<=k;j++){

setProperty("_root.mc"+j,_x,_root["mc"+j]._x+(_root["mc"+(j-1)]._x-_root["mc"+j]._x)/r);

setProperty("_root.mc"+j,_y,_root["mc"+j]._y+(_root["mc"+(j-1)]._y-_root["mc"+j]._y)/r);

}

选中第三帧处插入一个空白关键帧添加以下代码:

gotoAndPlay(2);

添加完代码以后回到主场景;

第四步:

把库中名为as的元件拖放到舞台上,给它一个实例名称mc0.在主场景内添加一个图层在第一帧加上拖动代码:

startDrag("_root.mc0",true);

注意这里是mc0不是mc,虽然你拖动的影片里面没有东西,在下面我后细说的;

做到现在就算完工了,我在这里就把重点的地方说一下。N为什么是它的一圈星星的个数

在第一个for循环语句里有这样一段,

setProperty("_root.mc"+i,_rotation,360/n*i);

看它的_rotation的值是360/n*i

也就是"_root.mc"+i,_rotation=360/16*i

也就是

_root.mc1._rotation=360/16*1

_root.mc2._rotation=360/16*2

_root.mc3._rotation=360/16*3

_root.mc4._rotation=360/16*4

_root.mc5._rotation=360/16*5

_root.mc6._rotation=360/16*6

_root.mc7._rotation=360/16*7

_root.mc8._rotation=360/16*8

_root.mc9._rotation=360/16*9

_root.mc10._rotation=360/16*10

.............._root.mc64._rotation=360/16*64

也就是说把360度平均分成16份,它们的角度就是这个值,360/16=22.5。

第一个MC的角度是从原MC角度22.5的地方开始复制出来的,第二个MC的角度是从原MC角度45的地方开始复制出来的,第三个MC的角度是从原MC角度67.5的地方开始复制出来的,直到乘到17的时候就重叠了,因为360/16*6=382.5,角最大值是360,当到382.5的时候它就把360看成0来计算了,结果就是22.5,当你把N的值调大的时候,比如36它就会有36个星星围成一圈了,360/36*i  也就是mc1角度是10*1,mc2的角度是10*2 ,mc3的角度是10*3  当乘到37的时候它的角度多了10也就是370,第37个MC的角度会是原MC角度的370-360也就是10,这就是N的值等于一圈星星的原因。

我们在主场景第一帧里放的代码明明是拖动的MC0,为什么MC复制出来的影片会跟着鼠标走,把在AS第二帧设置X、Y坐标的循环代码拿下来分析一下:

for(var j=1;j<=k;j++){

setProperty("_root.mc"+j,_x,_root["mc"+j]._x+(_root["mc"+(j-1)]._x-_root["mc"+j]._x)/2);

setProperty("_root.mc"+j,_y,_root["mc"+j]._y+(_root["mc"+(j-1)]._y-_root["mc"+j]._y)/2);

}

看它的X坐标,

setProperty("_root.mc"+j,_x,_root["mc"+j]._x+(_root["mc"+(j-1)]._x-_root["mc"+j]._x)/2);

setProperty这句话是说设置括号内(目标,目标的属性,该属性的值);

我们现在的目标就是主场景上面的mc1,mc2,mc3,mc4,mc5......mc64;

它们的X坐标值各是多少,为什么会跟随鼠标移动,我们来仔细地看下它们的值

_root.mc+i._x_root["mc"+j]._x+(_root["mc"+(j-1)]._x-_root["mc"+j]._x)/2

也就是

mc1._x=mc1._x+(mc+(j-1)._x-mc1._x)/2

假设mc1现在的坐标是300

也就是mc1._x=300+(mc+(j-1)._x-300)/2

现在我们已经得到两个数字了,还有一个mc+(j-1)._x,先算括号内,j-1第一次运行循环的时候j的值是1,就是1-1,也就是0;也就是mc+0,也就是mc0,也就是我们拖动的那个没有东西的影片剪辑。mc0是跟着我们的鼠标动的,上面搞清楚后,我们就在给mc0也就是我们鼠标的坐标假设一个值。随便设定一个我们就假设100吧,值有了我们在接着做算术。

mc1._x=300+(100-300)/2

也就是

mc1._x=300+负200/2

也就是

mc1._x=300+负100 //注意下负值是越乘负的越多,越除负的越少,加减相反

也就是

mc1._x=200;

当计算机运行到这里时,mc1的坐标是200了,但200还不符合我们所看到的效果,我们运行的时候是它的坐标是跟着鼠标走的,那么程序会接着往下走,它就会执行设定MC2的坐标了,MC2的坐标会是250,接着是MC3的坐标是275,总之是越往下它们坐标的间隔就会越小,你自己可以测试下看。

当循环完64次以后程序跳出循环了,那么就会TOGO到下一帧,执行gotoAndPlay(2);

又回来了,接着又是循环64次,代码还是相同的代码,不一样的是这次的坐标都是已经设置过的了,我们在看一下MC1现在的坐标是多少了,上次设置过后是200,那么现在是

mc1._x=200+(100-200)/2

也就是

150

这个坐标值会离鼠标越来越近的,直到和鼠标的坐标一样,那么相同后面的MC也一样会近,直到它们的坐标和鼠标相等为止,而且它们的坐标永远也不会小于鼠标的坐标。

时间: 2024-09-14 14:02:28

Flash好看的跟随鼠标的旋转星星的相关文章

FLASH跟随鼠标的旋转星星

  第一步: 打开FLASH,新建一个影片剪辑元件,命名为"星星",在里面绘制一个星星出来,并且把它的中心点和舞台注册点对齐,在第20帧和第40处各插入一个关键帧.选中第20帧,在它的中心点和舞台的注册点对齐的情况下按住SHIFT键进行等比例缩小(你认为差不多就行了),然后选中第1到20帧的任意一帧创建补间动画,打开属性面板把它的转调成逆时针,选中第20到40帧的任意一帧创建补间动画,打开属性面板把它的转调成顺时针. 第二步: 在新建一个影片剪辑元件,命名为"转圈的星星&qu

给blog添加效果(计数器、天气预报、精美flash时钟、跟随鼠标的萤火虫、跟随鼠标的文字、状态栏文本、副标_应用技巧

示例:http://blog.csdn.net/kvw3000本文收集整理而来,感谢各段代码提供者! 整理:回家念经(王结太) 1. 公告和计数器2. 天气预报 3. 跟随鼠标的萤火虫4. 状态栏文本5. 跟随鼠标的文字6. 每次打开的时候自动在顶部副标题位置显示一条不同格言7. flash精美时钟(新增) 在"选项"->"配置"的"静态新闻/声明"中加入下面相应的语句就可以实现相应的功能: 1. 公告和计数器代码: 代码填写在静态新闻/声

用Flash制作不错的鼠标跟随动画

跟随|鼠标 思路: 以前各种教程中说鼠标跟随的效果是用startDrag去产生的,在这里我用别的方法去跟大家show一个鼠标跟随的效果.跟着我的思路往下走,其实鼠标跟随说白了不就是要求对象的位置和鼠标位置一样吗?可是我还想让它产生一些效果,以避免跟随更单调怎么办呢?跟随的时候我想让它炫一些,这一点,我首先想到了影片剪辑的复制,因为一些效果我可以在影片剪辑中制作出来.呵呵.于是乎这一种鼠标跟随我用复制出来的影片剪辑做跟随鼠标的东东,既然跟随鼠标了,也就是说复制出来的影片剪辑的位置和当前影片中鼠标的

Flash跟随鼠标变化的滤镜效果

跟随|跟随鼠标|滤镜 本实例使用flash8制作和发布,请把你的ie浏览插件更新为flash8查看- 点击这里下载源文件 制作主要使用如下方法: 1.制作一个MC,拖入到舞台上,修改实例名为myMC 2.添加下列代码: import flash.filters.*;//载入滤镜类 // 定义初始斜角滤镜的偏移距离 var maxbeveldistance:Number = 5; // 创建一个斜角滤镜 var bevel:BevelFilter = new BevelFilter(); // 定

Flash精致动画图标:跟随鼠标移动的放大镜

放大|跟随|跟随鼠标 目前流行的图标设计软件组合是 Illustrator/ Corel Draw + Photoshop (本文不讨论象素图标),做出来的图标是静态的,如果要应用于Flash, 必须通过位图导入,且不说透明GIF的锯齿.PNG的大体积,光一个马赛克现象就使得可用性大打折扣了,更不用说做一个动态的图标. 用Flash设计图标的优点是显而易见的: 支持动态图标,无失真放大,移植方便,可以和声音结合等等.缺点是不适合表现复杂的光影,一看就是卡通的. 先看看我的实验作品: 点击这里下载

互动Flash动画:跟随鼠标移动拉伸的蜘蛛丝

flash动画|跟随|跟随鼠标|蜘蛛 以前个人网上的一个点辍,用画线实现的,希望给有想象力的同志一点启发. 完成效果如下,大家移动鼠标,可以看到蜘蛛丝会跟随鼠标移动和拉伸. 下面讲下实现的方法, (1)先建三个MC,如下: 一个是spider_mc,画一个蜘蛛,像样点就算了,呵呵!一个是net_mc一个网,当背景用的,没有用!最后一个是空的MC,叫line_mc,用来画线的. (2)回到场景,建三个层如下: 最底一个叫NET,用来放背景net 的,把net拉进去;中间一个层叫line,用来放li

在Flash中制作紧紧跟随鼠标的按钮说明文字

按钮|跟随|跟随鼠标 先看效果,紧紧跟随鼠标的按钮说明文字: 点击这里下载源文件 我以一个按扭为例来详细讲解制作过程.第一步:新建文件,创建按钮新元件(名为文章,你可以随你的意愿任取),绘制按钮.回到场景中,打开库,在图层1中的第一帧处把文章元件拖入场景中.第二步:创建影片剪辑新元件,(名为信息,同样,你可以随你的意愿任取),在第一层第5帧处插入空白关键帧,在第1帧和第5帧打开动作面板,分别输入代码:stop();在第5帧中绘制一个有边框的矩形,具体设置见图一: 在该层上新建层,第5帧处插入空白

在网页上做出这样一个小程序,老鼠跟随鼠标移动的问题。

问题描述 在网页上做出这样一个小程序,老鼠跟随鼠标移动的问题. 就是一个小老鼠,它会跟着你的鼠标移动,左边有一个食物罐子,你单击,就会从中洒出一个圆点(食物), 当小老鼠靠近圆点时,它就会自动吃.右边是一个圆形的东西,你单击它,小老鼠就会 跑到里面,在其中不停地跑动,我需要具体怎么做.我是初学者,希望老师们能讲的详细一些.需要用什么语言,软件做..之类的,尽量详细一些,谢谢. 解决方案 直接上代码 <!DOCTYPE html> <html> <head> <sc

JS实现跟随鼠标的链接文字提示框效果_javascript技巧

本文实例讲述了JS实现跟随鼠标的链接文字提示框效果.分享给大家供大家参考.具体如下: 这里使用JavaScript与CSS实现链接提示效果,不会改变你原来的链接结构,使用链接原有的title标签来实现,如果之前你使用有title标签,那你几乎只需把JS代码拷贝到你的网页中即可.你会发现,运行本效果后,鼠标在链接上移动的话,文字提示框会跟随鼠标而移动位置. 运行效果如下图所示: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran