Snap.SVG邊緣/ IE瀏覽器 - jQuery動畫停止

嗨我有一個動畫只是停止在IE和EDGE（罰款在Chrome中）運行的問題。Snap.SVG邊緣/ IE瀏覽器 - jQuery動畫停止

我得到了「文本後」的提示，但「textone1」等的不透明度仍然在開發工具中爲0，IE完全停止了動畫。

我確實在IE中得到一個控制檯錯誤「對象不支持屬性或方法'getCTM' - snap.svg-min.js（19,26680）」，這是我在Chrome中沒有得到的。

下面是運行時，它停止代碼：

HTML：

<g xmlns="http://www.w3.org/2000/svg" id="text" style="opacity: 1;" transform="matrix(1 0 0 1 -70 -150)"> 
<text id="XMLID_2_"> 
    <tspan class="st1 st2 bold textone1" style="opacity: 0;" x="-20" y="0">TEXT1</tspan> 
    <tspan class="st3 st2 textone2" style="opacity: 0;" x="74" y="0">TEXT2</tspan> 
    <tspan class="st3 st2 textone3" style="opacity: 0;" x="15" y="50">TEXT3</tspan> 
    <tspan class="st4 st2 bold textone4" style="opacity: 0;" x="305" y="50">TEXT4</tspan> 
    <tspan class="st3 st2 textone4" style="opacity: 0;" x="640" y="50">.</tspan> 
</text> 
</g>

JS：

var text = s.selectAll("#text"); 
var textone1 = s.selectAll("#text .textone1"); 
var textone2 = s.selectAll("#text .textone2"); 
var textone3 = s.selectAll("#text .textone3"); 
var textone4 = s.selectAll("#text .textone4"); 

textone1.attr({ 
    opacity: 0 
}); 
textone2.attr({ 
    opacity: 0 
}); 
textone3.attr({ 
    opacity: 0 
}); 
textone4.attr({ 
    opacity: 0 
}); 

text.animate({ 
    transform: "t-290,-150", 
    opacity:0, 
}, 0, mina.easein, function() { 
}); 

text.animate({ 
      transform: "t-70,-150", 
      opacity: 1 
     }, 0, mina.easeinout,function() { 

      alert("after text"); 

     textone1.animate({ 
      transform: "t-290,-150", 
      opacity: 1 
     }, 500, mina.easeinout); 

      textone2.animate({ 
      transform: "t-290,-150", 
      opacity: 1 
      }, 1000, mina.easeinout); 

      textone3.animate({ 
       transform: "t-290,-150", 
       opacity: 1 
      }, 1000, mina.easeinout); 

       textone4.animate({ 
       transform: "t-290,-150", 
       opacity: 1 
       }, 1000, mina.easeinout); 

});

有人能看到什麼，我可能會做錯誤導致IE/EDGE停止？

提前致謝！

來源

2016-08-22 KiwisTasteGood

我不確定你可以正確地將轉換應用到tspan元素。 – Ian

@伊恩伊恩，啊好的確定，所以我怎麼解決這個問題我想淡化tpsan，它在Chrome中的作用就是隻是一個IE的東西？ – KiwisTasteGood

@Ian試圖使用填充不透明度，而沒有運氣！ – KiwisTasteGood

看起來像@Ian指出我正確的方向。

出於某種原因，IE不喜歡tspan元素上的不透明度，我反而將這些應用於g標籤，它工作正常。

愛IE的另一個原因:)

來源

2016-08-22 13:30:06 KiwisTasteGood

Snap.SVG邊緣/ IE瀏覽器 - jQuery動畫停止

回答

相關問題