扫一扫分享
css Effects,一个 CSS 动效相关的网站。她集合 Web 开发中常用的动画效果,如鼠标悬停、输入框获取焦点、加载、以及其他动画;不仅有展示效果,并提供一键拷贝至剪切板,以便您可以在自己的项目中使用。
CSS Effects原本 fork 自 GitHub 项目:CSSFX ;在其基础上,增添了十余个常用动画效果;目前有收录各种品类动效 54 个。感兴趣的朋友也可以 fork 去,维护一个属于自己的专属动效池,在需要的时候,一键拷贝(copy),即可使用,很是方便。(这个项目,基于 Nuxt 开发,项目组织与配置具佳、更新或是维护,都十分便捷)。
对于 Web 开发,实现动画的方式有很多种;如 Js 组合 html (性能限制)、Svg (复杂,成本高)、Gif 动画(成本高、体积大)、Flash 动画(已被淘汰)、Javascript 组合 Canvas (略微复杂、性能问题)等等;还有就是基于 CSS3 Transition / Animation 来实现动画,它摆脱了对 Js 的控制,且能利用硬件加速,并能实现复杂动画效果,而且复杂度也不是很高;已经成为 Web 动画实现方案首选。而很多常见简单动画效果,已经有开发者基于 CSS 实现,您大可不必每次手动编写,即拷(Copy)即用,岂不美哉?假如您尚不知其中奥妙,也正好可以学习一下。
手机预览