9. 其它及參考資料

其它

animation-name 支援各瀏覽器支援程度

can i use

div{
  -webkit-animation-name: my_ani; /* Chrome、Safari */
  -mos-animation-name: my_ani;    /* Firefox */
  -ms-animation-name: my_ani;     /* IE */
  -o-animation-name: my_ani;      /* Opera */
  animation-name: my_ani;
}

div{
  -webkit-transform: all 1s;
  -mos-transform: all 1s;
  -ms-transform: all 1s;
  -o-transform: all 1s;
  transform: all 1s;
}

參考資料

1、30 Useful CSS Animation Examples For Logically Creative Minds

2、ScrollMagic 外掛

3、How to Animate on the Web With Greensock

4、Intro to CSS 3D transforms

5、HTML DOM AnimationEvent

6、關於 Auto-Placement Alogrithm

7、grid 簡寫形式