过渡CSS3不适用于safari和chrome，但在firefox上运行正常

Question

我无法在safari和chrome上制作过渡功能。

我有一个关键帧悬停的动画（背景图像移动），我通过转换应用鼠标移出效果，在firefox上完美运行，但在safari和chrome上无法正常工作并使用-webkit-不改变任何东西。

但过渡不适用于safari和chrome。

鼠标已经写完了：

.fabanim_to_right_from_left_new_object_appears_1 .object-moved {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.fabanim_to_right_from_left_new_object_appears_1:hover .object-moved {
    -webkit-animation: toRightFromLeftNewObjectAppears 0.3s forwards;
    -moz-animation: toRightFromLeftNewObjectAppears 0.3s forwards;
    animation: toRightFromLeftNewObjectAppears 0.3s forwards;
}

这是我的关键帧：

@-webkit-keyframes toRightFromLeftNewObjectAppears {
 49% {
 -webkit-transform: translate(100%);
 background-position:right;
}
 50% {
 opacity: 0;
 -webkit-transform: translate(-100%);
 background-position:left;
}
 100% {
 opacity: 1;
 -webkit-transform: translate(0);
 background-position:left;
}
}

我也有毫秒测试，但这对我不起作用：（

我做得不好？

您可以在此处查看示例：test transition

请帮忙。

谢谢。