当类通过jQuery应用时，CSS转换转换在Firefox中没有动画

我正在摆弄CSS3动画，而我似乎无法在Firefox中使用这个

动画将在悬停或类似的情况下触发，但我正试图通过jQuery在scroll上应用一个类，它不会触发动画，但会应用该类。这里是一个代码笔的情况，在铬工作，但不是FF。有什么想法吗

编辑：所以，我发现，如果我将该类直接应用于我试图设置动画的H1，那么它可以正常工作。因此，它似乎没有在应用了类的元素的子元素上触发动画。除此之外，还有其他解决方案吗

a） 将多个类添加到多个元素中，考虑到我希望在这两个元素上都发生事情 b） 使用关键帧动画 ?

可能重复：

HTML:

（在Firefox和Chrome中测试）

我做了以下更改：

CSS

header.scrolled {
    position: fixed;
}

h1.scrolled {
    -webkit-transform: translateX(0px);
       -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
         -o-transform: translateX(0px);
            transform: translateX(0px);
}

JavaScript

在

$（“标题”）.addClass（“滚动”）之后添加

setTimeout(function() {
    $("h1").addClass("scrolled");
},10);  

header.scrolled {
    position: fixed;
}

h1.scrolled {
    -webkit-transform: translateX(0px);
       -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
         -o-transform: translateX(0px);
            transform: translateX(0px);
}

setTimeout(function() {
    $("h1").addClass("scrolled");
},10);