網頁設定動畫方式有三種:
方法1:使用純CSS動畫
方法2:使用ngAnimate CSS3方式(在CSS用用ngAnimate參數)
方法3:使用ngAnimate JS方式,js控制CSS動畫(在module內寫m1.animation的function(不是用controller)
ngAnimate結合CSS動畫效果



01.方法1:純CSS的紅色漸變到黃色效果動畫(但無法用事件驅動):



02.方法1:純CSS的紅色漸變到黃色效果動畫(修改ng-model參數啟動,不用ngAnimate):



03.方法1:純CSS的紅色漸變到黃色效果動畫(用checked數值啟動,不用ngAnimate):



04.方法1:純CSS的紅色漸變到黃色效果動畫(用function啟動,要偵測大勾後的checked屬性):



05.方法2:紅色變淡,反向紅色淡變深(使用ngAnimate CSS3的方式)(設定顯示參數,可重複啟動):



06.方法2:紅色變淡,反向紅色淡變深(使用ngAnimate CSS3的方式)(用事件啟動,可重複啟動):



07.方法3:紅色方塊變大(使用ngAnimate JS方式,js控制CSS動畫)(用animation事件啟動,可重複啟動):
範例exp3-13-02.html