# 六角-第七週視差滾動

## animation

@keyframes(影格) example {
#開始動畫
from {left:0px; top:0px;}
#結束動畫
to {left:200px top:200px;}
}
animation-name: example 動畫名稱;
animation-duration:持續時間;

可以把持續時間額外拉一個class寫

*CAN I USE 網站可以查詢網站兼容性的網站

@keyframes其實也可以更改成%數，讓整個動畫寫得更精細

@keyframes(影格) example {
#開始動畫
0% {left:0px; top:0px;}
#結束動畫
100% {left:200px top:200px;}

animation-delay:延遲執行時間;

/* #重複跑幾次或是無限 */
animation-iteration-count: infinite;

/* 停留在哪一個影格 forwards(停在最後)、backwords(回到最原本的位置) 、both(前面兩個的混合) */
animation-fill-mode:both;