2015-02-24 5 views
0

после обновления моего firefox до версии 35.0.1 моя анимация svg не работает в firefox, но она работала в предыдущих версиях, и она по-прежнему работает в firefox beta (36), ночью (37.0a2) и другие браузеры (опера, хром, сафари, современный т):firefox 35.0.1: svg mask анимация не работает

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/

любая идея, почему? :(

ответ

0

Это было вызвано изменением в коде Firefox, который не был полностью правильным и который затем был зафиксирован. Bug 932771 вызвало это и ошибка 1127507 которая была портированном, насколько Firefox 36 установил ее.

Смежные вопросы