深入淺出網頁動畫

TonyQ

About me

TonyQ / 王景弘

跟這個場合有關的
前端/Web 網頁工程師

其他的不重要

進正題

網頁動畫

動畫？

網頁！

Gif

Gif

then ?

時代的眼淚
maquee

下拉式選單 ? 

Flash
sample

animation

起使狀態 >
（改變狀態） >
結果

linear animation

http://jqueryui.com/effect/

Examples

https://vtaiwan.tw/#!/

http://www.friendo.com.tw/

有規則，就可以更簡單

CSS

http://lea.verou.me/css-4d/

那還有什麼其他的？

互動

七點半的太空人

(parallax-scrolling)

特效的目的

讓使用者喜歡
小心別讓使用者疲勞

實作的問題

mobile frames

耗電  & 效能
 

setTimeout
vs 
requestAnimationFrame

Q & A