那些年最近好像賣得嚇嚇叫，不過我還是沒去看XD，而且這篇文章跟那些年沒有關係。。。
話說前幾天我跟我家女王去看「真愛挑日子」，導演用的是倒敘法，並且很強調時間的描述，有過去與未來時間的交錯，於是在劇中會不斷地出現時間，並且用滾動的時間代表時間往前或往後，比方說，從2001滾動到1963，從1966滾動到1970，而不是很普通的只是顯示現在時間是1963、1970。
這讓我手癢了，覺得一個小特效就可以讓生硬的描述變得生動起來，於是我就開始構思這個特效該怎麼在web上呈現。考慮到多位數的呈現而且還有效能的問題，我先不考慮直接用CSS來做定位，直接試試看用canvas的效果如何。
首先，數字只有0~9，要讓數字做循環的滾動並且無縫隙的接起來，我先準備一張圖片，這張圖片是從0~9再循環到0，之所以要循環到0，是因為要讓滾動時不會產生空隙，當然再計算時就需要take care一點。照慣例，廢話不多說，先來看看DEMO。
DEMO: http://dl.dropbox.com/u/751847/Lab/jq.scrollEffectNumbers/index.html
ㄎㄎ，希望有吸引你注意到時間滾動的特效，如果有興趣了解怎麼實做歡迎討論，這裡不討論詳細實做囉，目前測試過主流瀏覽器（包括IE6），都可以正常運作而且效能不錯，sourcecode我放在git 啦～ 另外阿～做完的贈品如下：http://dl.dropbox.com/u/751847/Lab/jq.scrollEffectNumbers/fruit.html（蝦毀～），一不小心就……變成遊戲了XD（圖片來源是和多繽紛樂，希望布丁大哥不會介意！）。做特效雖然很有趣，但我想應該會餓死。畢竟某種層面來說這相當沒有什麼意義XD唉～但我偏偏很喜歡做這種事～
後記：Cloud9IDE越來越好用了，尤其是跟git整合在一起之後，整個霹靂威的！應該過不久我的主要開發IDE就會換到Cloud9囉！讚！