炫酷的CSS3抖动样式:CSS Shake
CSS Shake是一个使用CSS3实现的动画样式，使用SASS编写，利用它我们可以实现多种不同样式的抖动效果（如下面的GIF图像）：
炫酷的CSS3抖动样式:CSS Shake
这是一个很微小的动画，但使用得当也是挺不错的，比如用在广告、图像、按钮上，这样可以用来吸引用户眼球从而促使去点击它。
这个Csshake有9个抖动样式，三个状态，如鼠标经过拉动、无限抖动、鼠标悬停拉动。
CSS Shake 使用方法：
首先引入css shake的样式表文件。
css3按钮：?http://www.huiyi8.com/css3/anniu/
给你的DOM元素添加shake class样式。抖动样式，一共9种，可以看Demo的效果对应添加你想要的css。
另外我还能通过 .freeze, .shake-constant & .hover-stop 来控制状态，大家可以试试看效果！
附注：Sass是一款前端CSS框架，它扩展了CSS3，增加了规则、变量、混入、选择器、继承等等特性。SASS是一种CSS的开发工具，生成良好格式化的CSS代码，并且还提供了许多便利的写法，大大节省了设计者的时间，使得CSS的开发，变得简单和可维护。SASS是Ruby语言写的，但是两者的语法没有关系。不懂Ruby，照样使用。只是必须先安装Ruby，然后再安装SASS。
demo请看：http://elrumordelaluz.github.io/csshake/
1. [图片] css-shake-demo.gif
2. [代码]首先引入css shake的样式表文件。
<link type="text/css" href="csshake.css">
3. [代码]抖动样式
<div class="shake"></div>
<div class="shake shake-hard"></div>
<div class="shake shake-slow"></div>
<div class="shake shake-little"></div>
<div class="shake shake-horizontal"></div>
<div class="shake shake.vertical"></div>
<div class="shake shake-rotate"></div>
<div class="shake shake-opacity"></div>
<div class="shake shake-crazy"></div>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
