鼠标滑过图片抖动晃动效果（css/Shake）

• 别人网站上看到鼠标经过图片左右抖动晃动的特效,自己也想弄一个,查了查是用到的就是CSS3的特性——Shake

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

• 这个Csshake有9个抖动样式，三个状态，如鼠标经过拉动、无限抖动、鼠标悬停拉动，一起来看一下吧。 实现方法也很简单，因为已经有了做好的CSS代码，我们只需要引入文件在需要抖动的地方调用即可。

• 1.下载CSS shake样式表

链接: https://pan.baidu.com/s/1nuLaitN 密码: 7ewr

• 2.引入CSS shake样式表

<link type="text/css" href="csshake.css">

• 3.在需要抖动的元素块中加入shake的class属性

抖动样式一共有九种自己选择喜欢的试试吧：


<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> //疯狂抖动