利用鼠标跟随做别具特色的导航条
作者 佚名技术
来源 服务器技术
浏览
发布时间 2012-07-14
|
? 做全Flash的网站少不了菜单，当然也少不了导航条，怎么做一个与众不同的导航条效果呢？大家可能在各种网站上已经看到了很多各具特色的导航效果，说不定以及挑花眼了，这些效果有的神奇多变，有的互动精致，而我们在本节要学习的这个效果，有一个最突出的特点，就是简单，几乎是使用最简单的as原理制作出来的，而且动感一点也不逊色于那些复杂的效果，这就告诉我们掌握技术固然重要，更重要的是运用技术的能力，相信经过不断的锻炼，你动动脑筋，发挥自己的想象力，会做得更出色。 实例效果描述： 导航条用颜色分为上下两层，下层是导航条的文字，看上去好象没什么特别的，但是当将鼠标移动到文字上，你就会发现，在上层会出现一个灰色的半透明阴影区域，随着你的鼠标而移动，鼠标动得越快，阴影的区域越大，变化得越快，当鼠标静止的时候，阴影区域也就随着消失了。 实现原理： 利用鼠标跟随的原理，在鼠标移动的时候得到鼠标的横坐标值，并进行一定处理，将处理后的值设置为跟随鼠标的阴影的横坐标，（主要是要使阴影有追赶鼠标的效果，因此应当将鼠标的坐标值减小一点）将鼠标这一帧与上一帧的横坐标值进行比较，我们就可以知道鼠标的移动是快还是慢，在得到这个差值后，就可以由其决定阴影的宽度，既然判断出鼠标运动的快慢，自然就可以使阴影跟随鼠标运动的速度变化宽度。 实例制作： 1) 打开flash,新建一个动画文件，modify-movie 打开movie properties面板，设置frame rate为18fps，宽为400像素，高为100像素。（如图1）  2) 使用菜单命令insert-symbol新建元件，命名为“背景”，使用rectangle tool（stroke color为无，fill color为兰色）绘制一个矩形，使用菜单命令windows-panels-info，打开info面板，设置矩形的宽度为400像素，高度为100像素。再使用菜单命令windows-panels-align打开align面板，设置矩形居中对齐。（如图2）  3) 新建一个元件，命名为“黄色框”，使用rectangle tool（stroke color为无，fill color为黄色）绘制一个矩形，使用菜单命令windows-panels-info，打开info面板，设置矩形的高度为20像素，宽度为100像素。再使用菜单命令windows-panels-align打开align面板，设置矩形居中对齐。（如图3）  4) 新建一个元件，命名为“条纹”，使用rectangle tool（stroke color为无，fill color为兰灰色）绘制一个矩形，使用菜单命令windows-panels-info，打开info面板，设置矩形的高度为100像素，宽度为1像素。再使用菜单命令windows-panels-align打开align面板，设置矩形居中对齐。（如图4）  5) 新建一个元件命名为“按钮”，并将其属性设置为button，使用rectangle tool stroke color为无，fill color为黄色）绘制一个矩形，在info面板上设置矩形宽为22，高为20。使用text tool输入文字：按钮。Windows-panels-character打开character面板，在此面板上设置文字的大小、颜色与字体。最后使用align面板将矩形与文字都居中对齐。（如图5）  6) 开始组装各个元件，回到scene 1，使用菜单命令window-library，打开library，从library中拖拽“背景”元件到scene 1，使用align面板将其对齐。Insert-layer在时间轴上新建一层，再从library 中拖拽“条纹”元件到这一层，使用align面板使其如图放置（如图6）。  使用菜单命令windows-panels-instance打开instance面板，设置“条纹“元件的name属性为“aa”。再新建一层，从library中拖拽“黄色框”元件到这一层，如图放置（如图7）。  最后新建一层，将“按钮”元件如图放置。（如图8）  下面我们开始编辑控制动化效果的as命令 |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢! |
你可能对下面的文章感兴趣
关于利用鼠标跟随做别具特色的导航条的所有评论
