在前端的開發(fā)過程中结啼，或多或少會(huì)有一些動(dòng)效類的需求匈挖，這個(gè)時(shí)候我們會(huì)有兩種方案
方案一：使用js去處理dom的移動(dòng)或者顯示隱藏（不推薦）
不推薦原因：因?yàn)槭褂胘s處理dom堪澎，在頁面上的效果會(huì)有很明顯的卡頓凫乖，因?yàn)闉g覽器的執(zhí)行機(jī)制是根據(jù)幀數(shù)來刷新渲染頁面的谒麦，如果你設(shè)置的時(shí)間大于或小于幀數(shù)峻仇，頁面就渲染就會(huì)出現(xiàn)卡頓并且不流暢
方案二：使用css去處理dom的樣式（推薦）
原因：css處理的是dom的樣式公黑，并不會(huì)直接操作dom元素
那么css的動(dòng)畫效果怎么做到暫停與恢復(fù)呢？
// 動(dòng)畫樣式
.container{
animation: rotate 20s linar infinite;
}
.container:hover{
// running 運(yùn)行
// paused 停止
animation-play-state:running;
