你的分享就是我们的动力 ---﹥

FLASH版仿苹果电脑桌面菜单滑动效果制作

时间:2011-10-12 21:26来源:www.chengxuyuans.com 点击:
前面有过HTML版仿苹果电脑桌面菜单滑动效果,这里用FLASH也做了一个,有感兴趣的朋友,可以参照教程。做一下,OK,先看一下演示效果:

http://www.68design.net/download/20087/20080715163736765.swf



1、首先新建一FLASH文件。然后准备几个用于制作菜单的水晶图标。最好是去下载FIREWORKS制作的图标。在一些素材站就可以搜索到的。



2、然后导入到FLASH中。
3、新建MC“icon0”。将图标Bitmap 1拖进舞台中。
4、然后在MC“icon0”上击右键,选链接属性。然后设置链接属性为“icon0"。



5、新建一个背景元件“bgbar”。然后在里面绘制导航栏的背景。



6、如步骤4所示,将背景元件的链接属性改为“bgbar”。



7、回到场景中,新建一AS图层,在AS帧中,添加代码:



详细代码:
//================版权声明开始================//
//★淘沙网:http://www.taoshaw.com
//★淘沙网所有教程欢迎转载。不过请转载时注明出处。谢谢合作。
//================版权声明结束================//
//定义链接的数组,用数组可以提高代码运行的效率.
var menu_URLs=new Array("
http://www.taoshaw.com","http://www.taoshaw.com","http://www.taoshaw.com",
"http://www.taoshaw.com","http://www.taoshaw.com","http://www.taoshaw.com
");
//最小缩写范围
var menu_minScale=100;
//最大扩大范围
var menu_maxScale=130;
//导航栏开始的X位置
var menu_StartX=280;
//导航栏开始的Y位置
var menu_StartY=200;
//ICON图标数量
var IconNumber=9;
//ICON缩小范围
var Icon_minScale=30;
var Icon_maxScale=60;
var Icon_Space=4;
//在此处创建导航菜单
//此处先复制背景
var DockMenu=createEmptyMovieClip("dmenu",10);
//设置背景元件的位置
DockMenu._x=menu_StartX;
DockMenu._y=menu_StartY; 
//调用库中的ICON图标到场景中
for(var i=0;i<IconNumber;i++){
//复制ICON图标
var theItem=DockMenu.attachMovie("icon"+i,"item"+i,i+10);
  theItem.attachMovie("label","ilabel",10);
  theItem.preItem=DockMenu["item"+(i-1)];
  theItem._x=theItem.preItem._x+theItem.preItem._width+Icon_Space;
  theItem.ilabel._visible=false;
  //设置链接对象
  theItem.URL=menu_URLs;
  theItem._xscale=Icon_minScale;
  theItem._yscale=Icon_minScale;
  theItem.onRelease=function(){
   getURL(this.URL);
  }
  //此处用于显示图标在鼠标移上或移开的时候的状态
  theItem.onEnterFrame=function(){
   if(this._parent.mover){
    var scale=Icon_maxScale-Math.abs(DockMenu._xmouse-this._x-30)/5;
    if (scale<Icon_minScale) scale=Icon_minScale;
    //缩放比例
    this._xscale+=(scale-this._xscale)/3;
    this._yscale+=(scale-this._yscale)/3;
   }
   if(this._parent.mout){
    this._xscale+=(Icon_minScale-this._xscale)/3
    this._yscale+=(Icon_minScale-this._yscale)/3    
   }
    this._x+=(this.PreItem._x+this.PreItem._width+Icon_Space-this._x)/3;   
  }
}
var theBGBox=DockMenu.attachMovie("bgbar","bgbox",1);
  theBGBox.onEnterFrame=function(){
   this._x=DockMenu["item0"]._x;
   this._width=DockMenu["item"+(IconNumber-2)]._x+DockMenu["item"+(IconNumber-2)]._width-DockMenu["itemCon"]._x;
  }
  
DockMenu.onEnterFrame=function(){
if(this.mover){
  this._xscale+=(menu_maxScale-this._xscale)/4;
  this._yscale+=(menu_maxScale-this._yscale)/4;  
}
if(this.mout){
  this._xscale+=(menu_minScale-this._xscale)/4;
  this._yscale+=(menu_minScale-this._yscale)/4;
  }
this._x+=(-this._width/2+menu_StartX-this._x)/3;
}
DockMenu.onMouseMove=function(){
if(this.hitTest(_root._xmouse,_root._ymouse,false)){
  this.mover=true;
  this.mout=false;
}else{
  this.mover=false;
  this.mout=true;
}
}
//AD
ad_text.border = 0;
ad_text.html = true;
ad_text.htmlText = "<a href=’http://www.taoshaw.com ’,target=’_blank’>淘沙网原创教程系列:http://www.taoshaw.com </a>";
//================版权声明开始================//
//★淘沙网:http://www.taoshaw.com
//★淘沙网所有教程欢迎转载。不过请转载时注明出处。谢谢合作。
//================版权声明结束================//
源文件下载:List_Ico.rar

本文地址http://www.chengxuyuans.com/Flash/24264.html