好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

解析css3shake抖动样式_html/css_WEB-ITnose

前端时间做项目发现一抖动按钮挺吸引眼球的,研究了下实现原理,在此和大家分享下:

CSS Shake 是一个使用CSS3实现的动画样式,使用SASS编写,利用它我们可以实现多种不同样式的抖动效果(如下面的GIF图像)。这是一个很微小的动画,但使用得当也是挺不错的,比如用在广告、图像、按钮上,这样可以用来吸引用户眼球从而促使去点击它。

其中有前辈为大家编写好了csshake.css ,大家可以去参考下:http://HdhCmsTestwebhek测试数据/misc/css-shake

Csshake有9个抖动样式,三个状态,如鼠标经过拉动、无限抖动、鼠标悬停拉动,下面一起来看看介绍:

使用教程

首先引入css shake的样式表文件。

 

给你的DOM元素添加shake class样式

查看更多关于解析css3shake抖动样式_html/css_WEB-ITnose的详细内容...

  阅读:36次