firefox 35.0.1：svg 蒙版动画不起作用

Question

在我的 firefox 更新到版本 35.0.1 后，我的 svg 动画在 firefox 中不工作，但它在以前的版本中工作并且它仍然在 firefox beta (36)、nightly (37.0a2) 和其他浏览器中工作（歌剧、chrome、野生动物园、现代即）：

html:

    <svg version="1.1" id="logo-svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="55px" height="53.758px" viewBox="-1061.986 3038.43 55 53.758" enable-background="new -1061.986 3038.43 188.279 53.758" xml:space="preserve">
                        <g id="logo-mask" >
                            <rect id="sygnet" fill="#FFFFFF" x="-1100" y="3038" width="100" height="50"/>
                        </g>
                        <g id="logo-black">
                            <rect id="sygnet" fill="#000000" x="-1100" y="3038" width="100" height="50"/>
                        </g>
                    </svg>
<div id="button">Click me!</div>

css:

    body{
    background-color: #777777;
}

#button{
    margin-right: 100px;
    display: block;
    width: 100px;
    height: 20px;
    float: right;
    background-color: #fff;
    cursor: pointer;
    text-align: center;
    line-height: 20px;
}

js（使用 snap.svg）：

$(document).ready(function(){
    var s = Snap(),
        svg = Snap.select('#logo-svg'),
        logo = Snap.select('#logo-mask'),
        logoBlack = Snap.select('#logo-black'),
        mask = svg.rect(-1100, 2830, 280, 100).attr({
            fill: 'white',
            id: 'maska-logo'
        });
    logoBlack.attr({'mask': mask, 'opacity': 1});
});

$(document).on('click', '#button', function(){
    var maska = Snap.select('#maska-logo');
    maska.animate({
        transform: 'T'+[0,200]
    }, 500);

});

简单示例：http://jsfiddle.net/7yq14L0f/2/

有什么想法，为什么？ :(

Answer 1

这是由 Firefox 代码的更改引起的，该更改不完全正确，后来已修复。已向后移植到 Firefox 36 已修复的错误 932771 caused it and bug 1127507。

firefox 35.0.1：svg 蒙版动画不起作用

firefox 35.0.1: svg mask animation doesn't work

firefox

animation

svg

mask

snap.svg