为你的网站加入鼠标滑过抖动样式

又是旧站的文章，再搬运一篇过来。本文属于CSS动画特效，短短的几行代码就可以实现鼠标滑过某区域，特定元素抖动的特效。

站长闲下来的时候，就四处逛逛网站，顺便扒点其他网站的代码，比如html、css、js；都是站长通过f12或者view-source扒到的，有些代码很容易就能扒到，有些很难，比如今天分享的这个，扒了得半小时，才找到css具体代码！支持所有网站，wordpress、typecho、hexo等等之类的。

有可能当时太菜，扒代码不太熟练吧。然后，顺便，今天再修改下代码，发出来供各位参考。

代码说明

该css代码，作用于class为item-content下的h2标签，当鼠标滑过class为item的区域，即.item:hover时，执行links动作，后面的参数为时间；@-webkit-keyframes规定了links执行的具体动作；可以参看参考本站首页的文章标题，鼠标滑过特效！

如果你想给自己网站某元素加入这种特效，只需替换.item及.item-content h2为所需要特效的元素即可

CSS代码如下

    .item:hover .item-content h2 {
        -webkit-animation: links .2s 2
    }
    @-webkit-keyframes links {
        0% {
            -webkit-transform: rotate(-2deg)
        }
        100% {
            -webkit-transform: rotate(2deg)
        }
    }

具体效果如下：