Javascript 使用回调同步jQuery+；CSS动画计时？

代码笔在这里：

我喜欢尽可能使用CSS转换，但有时我希望javascript代码在CSS动画完成后运行

我曾尝试过

webkittransionend

，但发现它有点不可靠（就跨浏览器可靠性而言）

设置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

），则可以跳过该变量

这种方法似乎是有效的，但我担心存在跨浏览器或排序的陷阱，这些陷阱并不是立即显现出来的

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