firefox 35.0.1:svg掩码动画不';行不通

firefox 35.0.1:svg掩码动画不';行不通,firefox,animation,svg,mask,snap.svg,Firefox,Animation,Svg,Mask,Snap.svg,在我的firefox更新到35.0.1版后,我的svg动画在firefox中无法工作,但在以前的版本中仍然可以工作,并且在firefox beta(36)、nightly(37.0a2)和其他浏览器(opera、chrome、safari、modern ie)中仍然可以工作: html: js(使用snap.svg): 简单示例:http://jsfiddle.net/7yq14L0f/2/ 你知道为什么吗(这是由Firefox代码中的一个更改引起的,该更改不是完全正确的,然后被修复。这是由Bu

在我的firefox更新到35.0.1版后,我的svg动画在firefox中无法工作,但在以前的版本中仍然可以工作,并且在firefox beta(36)、nightly(37.0a2)和其他浏览器(opera、chrome、safari、modern ie)中仍然可以工作:

html:

js(使用snap.svg):

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


你知道为什么吗(

这是由Firefox代码中的一个更改引起的,该更改不是完全正确的,然后被修复。这是由Bug引起的,Bug被后端口处理,直到Firefox 36修复为止

    <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>
    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;
}
$(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);

});