Jquery CSS3动画/变换在Chrome中不起作用

我正在使用Jquery和CSS3制作一些元素的动画（call+向我们发送一个消息按钮），使它们在可见时淡入并向上

该动画在IE10+上运行良好，但在Chrome上不起作用。当我在开发人员控制台中检查元素时，Jquery似乎也正确地添加了样式

以下是CSS：

.come-in {
   -webkit-transform: translateY(150px);
   transform: translateY(150px);
  animation: come-in 0.8s ease forwards;
  -webkit-animation: come-in 0.8s ease forwards;
}
.come-in:nth-child(odd) {
  animation-duration: 0.6s;
  -webkit-animation-duration: 0.6s;
}
.already-visible {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  animation: none;
  -webkit-animation: none;
}
@keyframes come-in {
  to { transform: translateY(0); 
       -webkit-transform: translateY(0); 
  }
}

Jquery：

$.fn.visible = function(partial) {

    var $t            = $(this),
        $w            = $(window),
        viewTop       = $w.scrollTop(),
        viewBottom    = viewTop + $w.height(),
        _top          = $t.offset().top,
        _bottom       = _top + $t.height(),
        compareTop    = partial === true ? _bottom : _top,
        compareBottom = partial === true ? _top : _bottom;

    return ((compareBottom <= viewBottom) && (compareTop >= viewTop));

};

(jQuery);


$(window).scroll(function(event) {

    $(".button").each(function(i, el) {
        var el = $(el);
        if (el.visible(true)) {
            el.addClass("come-in"); 
        } 
    });

});

$.fn.visible=函数（部分）{
var$t=$（此），
$w=$（窗口），
viewTop=$w.scrollTop（），
viewBottom=viewTop+$w.height（），
_top=$t.offset（）.top，
_底部=_顶部+$t.高度（），
compareTop=partial==true？\u底部：\u顶部，
compareBottom=部分===真？\u顶部：\u底部；
返回（（compareBottom=viewTop））；
};
（jQuery）；
$（窗口）。滚动（功能（事件）{
$（“.button”）。每个（功能（i，el）{
变量el=$（el）；
如果（el.可见（真实））{
el.addClass（“进来”）；
} 
});
});

以及相关的HTML：

 <div class="columns five button">
    <h2 class="no-margin padding-small"><img src="images/phone16.png" alt=""/>Call 128 3778 9237</h2>
    <div class="clear"><!-- ClearFix --></div>
</div>
<div class="columns five center button">
    <h2 class="no-margin padding-small"><img src="images/chat81.png" alt="" />Send us a message</h2>
    <div class="clear"><!-- ClearFix --></div>
</div>

致电128 3778 9237
给我们发个信

添加以下内容：

@-webkit-keyframes come-in {
  to { transform: translateY(0); 
       -webkit-transform: translateY(0); 
  }
}

---

Chrome 40中没有前缀。

当它在IE中工作，而不是在Chrome中工作时，你知道你有语法错误。在开发工具的JS控制台中没有语法错误，CSS中也没有任何内容。谢谢！真不敢相信我错过了在那里添加-webkit-前缀。