純CSS實現的加載動畫：Loaders.css
Loaders.css是一個專注性能純CSS實現的加載動畫效果。
What is this?
A collection of loading animations written entirely in css. Each animation is limited to a small subset of css properties in order to avoid expensive painting and layout calculations.
I've posted links below to some fantastic articles that go into this in a lot more detail.
Install
bower install loaders.css
Contributing
Pull requests are welcome! Create another file insrc/animationsand load it insrc/loader.scss.
In a separate tab rungulp --require coffee-script. Opendemo/demo.htmlin a browser to see your animation running.
Further research
- http://www.paulirish.com/2012/why-moving-elements-with-translate-is-better-than-posabs-topleft/
- http://aerotwist.com/blog/pixels-are-expensive/
- http://www.html5rocks.com/en/tutorials/speed/high-performance-animations/
- http://frontendbabel.info/articles/webpage-rendering-101/
Suggested use
Wrap the surrounding container indisplay:flexand center the animation.
本文由用戶 g2b4 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！