纯 CSS3 电风扇动画 可调节转速

本文作者html5tricks,转载请注明出处

这又是一个用纯CSS3实现的模拟现实物品的动画特效,它是一个可以调节转速的电动风扇,电风扇动画分两部分,一部分是扇叶转动,另一部分是风扇水平摇头,跟现实中的台扇十分相似。另外,我们还可以通过按钮来调节转速,一共分为三档。同时还有一个开关按钮,和我们生活中的风扇控制方式基本一致。而如此复杂的逻辑却是用纯CSS3实现,真的非常厉害了。

pure-css3-fans

在线演示源码下载

扫描下方二维码关注公众号

发送消息 jymm 获取 解压密码

分享HTML5/CSS3技术;jQuery插件;Vue、React等前端开发组件

热门推荐