[外掛]關於Loadingbar

之前看到Loadingbar就會覺得莫名開心
才發現我其實是loading控！愛到想要把Loadingbar的祖宗十八代都挖出來~

但其實Loadingbar的做法有很多種，用flash、CSS、gif做動畫，再用as或Js去控制，控制方法也不只一種，用.load或TweenLite...等等，持續研究更新囉！
progressBar：也可以用這個去找相關資料

Loadingbar的各種寫法

＊Flash寫法

Flash去就不討論了

＊TweenLite.fromTo

可以參考這邊
用這個控制時間跟淡入淡出，如下：

function enterPreloader() {

     TweenLite.fromTo( '#preloadArt2',2.6,{ width: 250, opacity: 0, marginLeft: -200, marginTop: -200, height: 400 },{ width: 652, height: 652, opacity: 1, ease: Expo.easeOut, marginLeft: -326, marginTop: -326, onComplete: function () { sequencer.nextStep() } }

      );

    TweenLite.fromTo('#preloadArt', .7, { opacity: 0 },{ opacity: 1, ease: Linear.easeNone, delay: 1.5 });}

＊Doms

老實說我是第一次看到這個指令，有機會繼續鑽研！

＊GIF圖檔+.load

先Photoshop做一個gif檔的動畫，再用JS的load指令去跑~
.load是用來偵測檔案是否下載完成的，不過下載時間不確定，我都會再加個計時器來使用。

＊CSS寫動畫+JS外掛

參考網頁
用CSS寫好自己想要的動畫再掛他的JS就可以用了！