flash無縫滾動圖片

網頁上經常會用到無限循環滾動的圖片這種效果,在flash當中來做的話,常規的方法是圖片放在一個MC或graphic,再把要展示的多幅圖片依次相鄰排好(假設它們總長爲N,然後按同樣的順序再放一組,和前面的首尾相接),然後用AS移動它並且判斷當它移過的距離大於等於N時,就將座標向相反方向移動N個像素的距離。具體見源文件marquee_a.zip。

  但是這樣做出來的源文件用過一次之後基本就沒用了,下次再用到的時候得重新做,而且一旦做好,想改變一下圖片的數目就不是那麼方便,有沒有解決的辦法呢,有,我們按照上面的思路寫如下AS(源文件marquee_b.zip下載文件點擊下載此文件
 ):

//圖片總數目,爲提高速度,圖片按1.jpg,2.jpg這樣的規則依次命名,大小100*40
_global.i=6;

//100是圖片的寬度,leng是i張圖片的總長度
_global.leng = i*100;


//產生一個總的MC snow
_root.createEmptyMovieClip("snow", 0);

//snow內部的MC
_root.snow.createEmptyMovieClip("a", 0);
_root.snow.createEmptyMovieClip("b", 1);

//排列a和b
_root.snow.a._x = 0;
_root.snow.b._x = _roob.snow.a._x+leng;

//create and load jpg
//在mc a和b內部產生數目爲i的空MC並依次加載圖片進去
for (j=1; j<=i; j++) {
    _root.snow.a.createEmptyMovieClip("mc"+j, j);
    _root.snow.b.createEmptyMovieClip("mc"+j, j);
    _root.snow.a["mc"+j].loadMovie("image/"+j+".jpg");
    _root.snow.b["mc"+j].loadMovie("image/"+j+".jpg");

//設置MC的座標,讓它們依次排開
    _root.snow.a["mc"+j]._x = (j-1)*100;
    _root.snow.b["mc"+j]._x = (j-1)*100;
}

//let me move
_root.snow.onEnterFrame = function() {

//向左移動總的MC snow
    _root.snow._x -= 1;

//當snow向左移動的距離大於等於leng時,將它向右移動leng個像素的長度
    if ((-_root.snow._x)>=leng) {
        _root.snow._x += leng;
    }
}  在源文件marquee_a.fla中,要想實現在某個圖片上點擊,跳轉到相應的地址非常簡單,就不多說了,但上面這種因爲是通過AS生成的,且使用了循環語句,再想添加同樣的效果似乎不那麼容易,真的沒辦法了嗎?我靠我不信,經過喝飲料散步等準備工作之後,得到靈感,放棄了添加複雜的判斷語句的辦法,下面我們來看代碼:


margin = _root._xmouse-_root.snow._x;
if(margin>=i*100){
    margin-=leng;
}
id = Math.ceil(margin/100);
this.onMouseDown = function() {
    getURL("http://localhost/url.php?id="+id, "_blank");
};  上述代碼的意思就是通過判斷點擊時鼠標和MC snow的x座標的差來計算出鼠標現在空間點擊在了哪個圖片上,然後就搞定了。當然,在實際運用的時候,可以修飾一下,比如鼠標下面放一個按鈕,這樣當鼠標移動到動畫上方時指針會變形,給訪客以提示,好讓他們知道是可以點擊的。

  其實這個例子最妙的用處還不是在這兒,試着再進一步想,假設我們把實現這個效果的圖片放在一個單獨的image目錄下,再用後臺程序獲取裏面的圖片數目傳遞給變量i,就可以任意改變image目錄下的圖片而不用再去做新的動畫了。 
發佈了17 篇原創文章 · 獲贊 0 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章