使用回调来同步jQuery + CSS动画计时有什么缺点？

Question

CodePen：http://codepen.io/leifparker/pen/ogboag

我喜欢尽可能使用CSS转换，但偶尔会遇到我想在CSS动画完成后运行javascript代码的时间。

我已经尝试了webkitTransitionEnd，但发现它有点不稳定（就浏览器的跨浏览器可靠性而言）。

设置javascript计时器setInterval()似乎是一个古老的推荐方法，但是使用空（无效）jQuery .animation()回调是否有任何问题？

$('.button').click(function(){
    keepIndent = parseInt($('.kicker').css('text-indent'));
    $('.kicker').toggleClass('active').animate({ 
        textIndent : keepIndent
    },300,function(){
        $('.pebble').toggleClass('active');
    });
});

我在.kicker上切换活动类，使用CSS为其设置动画，然后在（无效）.animate()回调上切换，我在.pebble上切换类。显然，.animate(speed)必须与CSS转换动画长度匹配，以实现同步延迟。

keepIndent变量用于使动画在视觉上无效，但如果在没有背景的元素上为未明显使用的属性分配了任意值（例如backgroundPositionX），则可以跳过该变量分配）。

这种方法似乎有效，但我担心存在跨浏览器或排序的缺陷，这些缺陷并不是很明显。

你能想出不使用这种方法的任何理由吗？