微信 css3动画失效,css3 动画效果在微信中无效

在微信浏览器中就是

在微信浏览器 动画没有效果

不会跳动和移动

上代码：

//左右过渡动画

.sign-progress1 span.rightlate{

position: relative;

}

.sign-progress1 span.rightlate:after{

position: absolute;

top: -0.845rem;

content: '';

display: inline-block;

width: 0.77rem;

height:1.086rem;

background: url(../img/sign_style_active_top.png) no-repeat;

background-size: 100%;

animation:rightlate;

-webkit-animation: rightlate;

animation-duration: 1s;

-webkit-animation-duration: 1s;

}

@-webkit-keyframes rightlate{

from{

-webkit-transform: translateX(-100%);

transform: translateX(-100%);

}

to{

-webkit-transform: translateX(0%);

transform: translateX(0%);

}

}

@keyframes rightlate{

from{

-webkit-transform: translateX(-100%);

transform: translateX(-100%);

}

to{

-webkit-transform: translateX(0%);

transform: translateX(0%);

}

}

请问大神我哪里有问题么？