.common_animate:hover{
animation-duration:1s; /*动画时间*/
animation-fill-mode: both; /*播放后的状态*/
animation-name: buzz-out;
animation-iteration-count: infinite; /*动作循环的次数:infinite 无限循环*/
transform-origin: center bottom; /*设置动画旋转元素的基点为:居中靠下*/
0%,
100%,
20%,
50%,
80% {
transition-timing-function: cubic-bezier(0.215,0.61,0.355,1); /*贝塞尔曲线 : X1 Y1 X2 Y2*/
transform: translate3d(0,0,0); /*设置只在Z轴上移动*/
}
40%,
43%{
transition-timing-function: cubic-bezier(0.755,0.50,0.855,0.060);
transform: translate3d(0,-30px,0);
}
70%{
transition-timing-function: cubic-bezier(0.755,0.050,0.855,0.060);
transform: translate3d(0,-15px,0);
}
90%{
transform: translate3d(0,-4px,0);
}
}
animation-duration:1s; /*动画时间*/
animation-fill-mode: both; /*播放后的状态*/
animation-name: buzz-out;
animation-iteration-count: infinite; /*动作循环的次数:infinite 无限循环*/
transform-origin: center bottom; /*设置动画旋转元素的基点为:居中靠下*/
cursor: pointer;
}
0%,
100%,
20%,
50%,
80% {
transition-timing-function: cubic-bezier(0.215,0.61,0.355,1); /*贝塞尔曲线 : X1 Y1 X2 Y2*/
transform: translate3d(0,0,0); /*设置只在Z轴上移动*/
}
40%,
43%{
transition-timing-function: cubic-bezier(0.755,0.50,0.855,0.060);
transform: translate3d(0,-30px,0);
}
70%{
transition-timing-function: cubic-bezier(0.755,0.050,0.855,0.060);
transform: translate3d(0,-15px,0);
}
90%{
transform: translate3d(0,-4px,0);
}
}