为什么在safari上css3的-webkit-animation不起作用？

在loje.in里点击球里的召唤者山谷进入的第二页，
为什么在safari上【我是男生】跟【我是女生】的动画不生效？

我在新的页面上loje.in/web做过测试，已经排除了safari兼容上的问题。所以是不是在css3动画是不是在某些地方会存在冲突导致不能生效？

.man,.woman{
    width: 120px;
    height: 120px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 100%;
    -webkit-animation: sexy 1s ease-in-out infinite;    /* Safari 和 Chrome */
}

    @-webkit-keyframes sexy /* Safari 和 Chrome */
    {
    0% {-webkit-transform: translate(0px,-5px);opacity:0.5;}
    50% {-webkit-transform: translate(0px,0px);opacity:1;}
    100% {-webkit-transform: translate(0px,-5px);opacity:0.5;}
    }

---

重新检查并修补了下css文件里所有的关于animation的属性，

看来所有针对相关浏览器兼容的代码是必须要同时规范，

例如-webkit-animation后面接的一定是@-webkit-keyframes而不是@keyframes，后面所写的其他动画才会一并生效的。

---

keyframes也需要浏览器hack，-webkit-keyframes等