搜索

首页  >  问答  >  正文

css3的复杂动画转成jquery调用怎么写

@-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
}

PHP中文网PHP中文网2785 天前520

全部回复(1)我来回复

  • 怪我咯

    怪我咯2017-04-17 11:21:16

    -webkit-animation-name:bounceInRight;
    

    这个单独那出来做一个样式类
    jquery只用为这个元素添加这个类就可以执行动画了

    回复
    0
  • 取消回复