CSS3头像振动特效

以下是代码：

.comment-head .avatar{width:40px;height:40px;margin-right:8px;float:left;padding:2px;border:1px solid #eeeeee;cursor:pointer;display:inline-block;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);box-shadow:0 0 1px rgba(0, 0, 0, 0);}.comment-head .avatar:hover{-webkit-animation-name:buzz;animation-name:buzz;-webkit-animation-duration:.15s;animation-duration:.15s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}@-webkit-keyframes buzz{50%{-webkit-transform:translateX(3px) rotate(2deg);transform:translateX(3px) rotate(2deg);}100% {-webkit-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg);}}@keyframes buzz {50%{--ms-transform:translateX(3px) rotate(2deg);}100% {-webkit-transform:translateX(-3px) rotate(-2deg);-ms-transform:translateX(-3px) rotate(-2deg);transform:translateX(-3px) rotate(-2deg);}}

CSS3头像振动特效相关推荐

一款基于jquery和css3的头像恶搞特效
今天给大家分享一款基于jquery和css3的头像恶搞特效.这款实例中,一个头像在画面中跳舞,头像还有可爱的帽子,单击下面的按钮可以为头像切换不同的帽子.效果图如下: 在线预览源码下载实现的代 ...
html头像特效,一款基于jquery和css3的头像恶搞特效
今天给大家分享一款基于jquery和css3的头像恶搞特效.这款实例中,一个头像在画面中跳舞,头像还有可爱的帽子,单击下面的按钮可以为头像切换不同的帽子.效果图如下: 实现的代码. html代码: H ...
html绘制头像原样教程,CSS实例教程：创意CSS3头像展示教程
今天就为大家分享一个非常有创意的CSS3头像展示效果,交互性强,是一个基于css3和js来实现的,代码量不多,但是最终的效果却很让人赞叹,所以特别推荐给大家.其中关于本示例的一些css样式呈现,个人认 ...
css3 3d头像,创意css3头像展示_觉唯设计
今天就为大家分享一个非常有创意的CSS3头像展示效果,交互性强,是一个基于css3和js来实现的,代码量不多,但是最终的效果却很让人赞叹,所以特别推荐给大家.其中关于本示例的一些css样式呈现,个人认 ...
可控制转速CSS3旋转风车特效
以前制作网页动画一般使用javascript,现在已经有越来越多动动画使用纯CSS实现,并且动画的控制也可以使用CSS3实现,因为CSS 3来了,CSS 3的动画功能确实强大.以下是一个纯CSS3制作 ...
css 水珠动图,CSS3逼真水珠特效
CSS3逼真水珠特效- www.shouce.ren body{background: #013668;} #pepsi{position: absolute;left: 30%;top: 30%;} ...
css3的动画特效--元素旋转（transition，animation）
css3的动画特效--元素旋转(transition,animation) 开发中,视觉要你实现一个元素的旋转问题,比如说如下图所示: 思路:首先动画动效肯定离不开anmimation动画. 和tra ...
CSS3制作文字特效
今天主要搜集了一些网页中文字用css3制作的特效,并亲自尝试了一下,现把关键的代码和效果贴出来与同学们一起分享,希望能对大家在平时的制作中有所帮助.废话不说,直接进入效果的制作,感兴趣的同学跟着我的代 ...
CSS3实现烟花特效 --web前端
烟花特效,比较简单,直接贴代码了-- <!DOCTYPE html><html lang="en"><head> <meta charse ...

CSS3头像振动特效

CSS3头像振动特效相关推荐

最新文章

热门文章