2015-02-24 58 views
0

我的firefox更新到版本35.0.1之後,我的svg動畫在firefox中不起作用,但它在以前的版本中工作,它仍然在firefox beta(36 ),夜間(37.0a2)和其他瀏覽器(歌劇,鉻,野生動物園,現代IE):firefox 35.0.1:svg mask animation does not work

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

它是由在火狐代碼這是不完全正確的,然後將其固定的變化引起的。錯誤932771造成它和錯誤1127507將其儘可能火狐36固定它反向移植。