簡要教程
Repaintless.css是一款輕量級高性能的CSS3動畫庫。Repaintless.css通過特殊的方法來制作元素動畫，不會引起頁面的重繪，使它比其它CSS動畫庫具有更高的性能。
安裝
你可以通過bower或npm來安裝Repaintless.css。
$ bower install repaintless $ npm install repaintless
使用方法
使用該CSS3動畫庫需要在頁面中引入repaintless.css文件。
<link href="path-to-css-directory/repaintless.css" rel="stylesheet"></link>
HTML結(jié)構(gòu)
要使一個元素可以動畫，你需要做的就是為該元素添加element-animated class，這個是必須添加的class類，然后使用第二個class類來指明你需要的動畫類型。
<div class="element-animated tremble"> I tremble! </div>
默認情況下動畫的時間是1秒鐘。你可以通過class short來指定動畫時間為0.5秒，long為2秒。如果你需要做無窮動畫，可以添加infinite class。
<div class="element-animated slide-from-top short"> I am quick! </div> <div class="element-animated slide-from-top long"> I am slooow... </div> <div class="element-animated slide-from-top infinite"> I will do that forever to drive you crazy! </div>
動畫類型
Repaintless.css所有可用的動畫類型如下。某些動畫是會一直循環(huán)的動畫。
slide-from-top
slide-from-bottom
slide-from-left
slide-from-right
slide-from-right-bottom
slide-from-right-top
slide-from-left-bottom
slide-from-left-top
slide-top-bottom (looped)
slide-left-right (looped)
tremble (looped)
fade-in
fade-out
pulsate (looped)
rotate
Repaintless.css動畫庫的github地址為：https://github.com/szynszyliszys/repaintless
來源：http://www.htmleaf.com/css3/css3donghua/201603073189.html