梅干已經很久沒寫Flash了,更別說是Actionscript2.o,但最近有網友問到,如何利用AS2.0作出滑動式的圖片選單,正巧梅干有點空檔時間,便花了點時間,找回先前的片段記憶,拼拼湊湊終於完成了此範例,梅干也盡量將寫法簡單化,也讓該範例能不用改太多就可直接來套用,現在就來看一下這個AS2的滑動圖片選單。
Step1
開啟Flash,依照下圖完成各元件的製作與命名。
Step2
新增一個as圖層,並對著影格1按F9,輸入下方的語法。
基本版:
//取遮罩的寬度
var w=mask._width;
//取遮罩的x、y
var xx=mask._x;
var yy=mask._y;
//將所有圖片的y與遮罩對齊
allimg_mc._y=yy;
//所有的按鈕事件
btn01.onRollOver = function() {
xx=37;
};
btn02.onRollOver = function() {
xx=-(w*1)+37;
};
btn03.onRollOver = function() {
xx=-(w*2)+37;
};
btn04.onRollOver = function() {
xx=-(w*3)+37;
};
//所有圖片當載入時滑動效果
allimg_mc.onEnterFrame = function () {
allimg_mc._x = allimg_mc._x+(xx-allimg_mc._x)0.45;
}
簡化版:
//取遮罩的寬度
var w=mask._width;
//取遮罩的x、y
var xx=mask._x;
var yy=mask._y;
//滑動的速度0~1之間,數值愈小速度愈慢
var movev=0.25;
//將所有圖片的y與遮罩對齊
allimg_mc._y=yy;
//所有的按鈕事件
for (i=1;i<=4;i++){
btn = eval(“btn0”+i);
btn.onRollOver = function() {
_i=this._name.substring(4)-1;
xx=-(w_i)+37;
};
}
//所有圖片當載入時滑動效果
allimg_mc.onEnterFrame = function () {
allimg_mc._x = allimg_mc._x+(xx-allimg_mc._x)*movev;
}
這邊大概沒有什麼需要調整,若要增減圖片,只需直接加到allimg_mc影片元件中,若要改變照片的大小,mask與allimg_mc二個都要要一樣喔!這樣在跑的時候才不會出現問題,至於滑的快慢直接修改movev這數值就可以了。
還是建議各位,若可以的話,放棄Actionscript2.0改用Actionscript3.0吧!依目前的Flash的發展,未來應該會慢慢的犧牲掉AS2.0了,所以還是趁早改用AS3.0吧!
[滑動圖片1-範例預覽] [滑動圖片1-範例下載]
[滑動圖片2-範例預覽] [滑動圖片2-範例下載]