Heim > Fragen und Antworten > Hauptteil
@-webkit-keyframes bounceInRight {
0%, 100%, 60%, 75%, 90% {
-webkit-animation-timing-function: cubic-bezier(0.215, .61, .355, 1);
animation-timing-function: cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0)
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0)
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0)
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0)
}
100% {
-webkit-transform: none;
transform: none
}
}
.animatedtemo {
-webkit-animation-name:bounceInRight;
-webkit-animation-duration: 2s;
animation-duration:2s;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards
}
怪我咯2017-04-17 11:21:16
-webkit-animation-name:bounceInRight;
这个单独那出来做一个样式类
jquery只用为这个元素添加这个类就可以执行动画了