日韩天天综合网_野战两个奶头被亲到高潮_亚洲日韩欧美精品综合_av女人天堂污污污_视频一区**字幕无弹窗_国产亚洲欧美小视频_国内性爱精品在线免费视频_国产一级电影在线播放_日韩欧美内地福利_亚洲一二三不卡片区

Flash動態(tài)緩沖圖片導航制作詳解_Flash教程

編輯Tag賺U幣
教程Tag:暫無Tag,歡迎添加,賺取U幣!

推薦:Photoshop與Flash合作制作模糊漸變動畫
在一些片頭動畫里我們經(jīng)常能看到很炫的模糊效果,極具視覺沖擊。高質(zhì)量的模糊效果大多利用Photoshop處理后才導入flash中進行制作。其實,在Flash中也可以利用其

  緩沖公式在制作特效中非常有用,聞名的三星導航菜單就用到了此公式�,F(xiàn)在許多網(wǎng)站出盡風頭,其中緩沖導航是其一大亮點。本文以一德國網(wǎng)站的導航為例,詳解緩沖導航的制作。這個效果是我和溶劑共同完成的,他提供坐標的算法,我提供縮放的算法。

  本例效果演示

/uploads/jc//20061008091839_01.swf
鼠標劃過的部分圖片會變大

  制作思路

  1. 圖片縮放控制
    利用緩沖公式設(shè)置圖片的縮放比例,假如鼠標滑過某圖片,放大1.8倍。假如其它圖片的序號與此圖片的序號相差1,就是此圖片兩邊的圖片,放大1.4倍,其它的為原始大小。
  2. 圖片坐標控制
    當某圖片放大時,相鄰的圖片的坐標等于此圖片的坐標加上這兩張圖片的寬度的一半,實現(xiàn)圖片無間距排列。
  3. 線條和文字控制
    線條用畫線函數(shù)實現(xiàn),文字的坐標和縮放比例與對應(yīng)的圖片相同。

  制作過程
  1、啟動Flash,新建一個影片,設(shè)置影片大小為600px*200px。
  預(yù)備好如圖中的素材,圖片的實例名分別為zjs0到zjs4,文字的實例名分別為z0到z4。
  把中間的圖片坐標設(shè)為(300,130),選中全部的圖片,按CTRL+K調(diào)出排列面板,設(shè)置為頂部對齊,使圖片的y坐標相同,圖片的x坐標通過AS來控制。用同樣的方法使方字的y坐標相同,并調(diào)整好文字和圖片的間距。

  2、在主場景中的第一幀上添加下列代碼

 

//獲取中間圖片的x坐標 

for (var i = 0; i<5; i  ) { 

 this["zjs" i].n = i; 

 //每個圖片MC下定義一個變量 

 this["zjs" i].onRollOver = function() { 

  control = true; 

  //鼠標滑過圖片時為真 

 }; 

 this["zjs" i].onRollOut = function() { 

  control = false; 

  //鼠標移出圖片時為假 

 }; 

} 

onEnterFrame = function () { 

 for (var k = 0; k<5; k  ) { 

  this["z" k]._x = this["zjs" k]._x; 

  // 說明文字的x坐標等于本應(yīng)圖片的x坐標 

  this["z" k]._xscale = this["zjs" k]._xscale; 

  this["z" k]._yscale = this["zjs" k]._yscale; 

  // 說明文字的縮放比例與圖片相同 

 } 

 if (control) { 

  mouse_in(); 

 } else { 

  mouse_out(); 

 } 

 // 條件真或假時調(diào)用函數(shù) 

}; 

//坐標設(shè)置函數(shù) 

function setX() { 

 for (var k = -2; k<3; k  ) { 

  this["zjs" (k 2)]._x = myx this["zjs" 2]._width*k; 

  //以中間圖片為準無間距排列 

 } 

 for (var k = Number(temp1) 1; k<5; k  ) { 

  //temp1為縮放比例最大的圖片下的變量值 

  var mc1 = this["zjs" k]; 

  var mc2 = this["zjs" (k-1)]; 

  //此圖片右邊的其它圖片 

  mc1._x = mc2._x (mc2._width mc1._width)/2-1; 

  //設(shè)置這些圖片的x坐標,1為消除圖片間的空隙 

 } 

 for (var k = Number(temp1)-1; k>-1; k--) { 

  var mc1 = this["zjs" k]; 

  var mc2 = this["zjs" (k 1)]; 

  mc1._x = mc2._x-(mc2._width mc1._width)/2 1; 

 } 

 //縮放比例最大的圖片的左邊的圖片的x坐標設(shè)置 

 myLine(); 

 //圖片下方的線條 

} 

//比例縮放函數(shù) 

function move_scale(x, obj) { 

 speed = (x-obj._xscale)*.65 speed*0.6; 

 obj._xscale  = speed; 

 obj._yscale  = speed; 

 //緩沖公式,x為圖片的縮放比例,obj為MC 

} 

//鼠標滑過圖片時,圖片的縮放、x坐標設(shè)置函數(shù) 

function mouse_in() { 

 for (var i = 0; i<5; i  ) { 

  var mc = this["zjs" i]; 

  //獲得實例名 

  if (mc.hitTest(_xmouse, _ymouse, true)) { 

   move_scale(180, mc); 

   //假如鼠標位于圖片的上方,圖片放大1.8倍 

   temp1 = mc.n; 

   //把此圖片下的變量賦給變量temp1 

  } else if (Math.abs(mc.n-temp1) == 1) { 

   move_scale(140, mc); 

   //兩側(cè)的圖片比例放大1.4倍 

  } else { 

   move_scale(100, mc); 

   //其它的圖片為原始大小 

  } 

 } 

 setX(); 

 //設(shè)置圖片的x坐標 

} 

//鼠標移出圖片時,圖片的縮放、x坐標設(shè)置函數(shù) 

function mouse_out() { 

 for (var i = 0; i<5; i  ) { 

  move_scale(100, this["zjs" i]); 

  //縮放比例為1,恢復原始大小 

 } 

 setX(); 

 //坐標復原 

} 

//線條函數(shù) 

function myLine() { 

 createEmptyMovieClip("line", 1); 

 //創(chuàng)建一個空影片 

 with (line) { 

  lineStyle(0.1, 0xff9933, 100); 

  moveTo(zjs0._x-zjs0._width/2, zjs0._y 10); 

  lineTo(zjs4._x zjs4._width/2, zjs4._y 10); 

  //圖片下方水平的直線 

  moveTo(zjs0._x-zjs0._width/2, zjs0._y 5); 

  lineTo(zjs0._x-zjs0._width/2, zjs0._y 15); 

  //右邊垂直的直線 

  moveTo(zjs4._x zjs4._width/2, zjs4._y 5); 

  lineTo(zjs4._x zjs4._width/2, zjs4._y 15); 

  //左邊垂直的直線 

 } 

} 

分享:Flash實例教程:星星跟我走
實例說明在FlashMX當中鼠標的跟蹤的制作方法有很多種,為你介紹其中的一種可以有多種變化方式的鼠標跟蹤。讓星星緊隨你的鼠標轉(zhuǎn)動。有關(guān)知識繪制實例,star

/所屬分類:Flash教程/更新時間:2008-03-05
相關(guān)Flash教程