0

Hi everybody i need to animate an svg. It works perfectly in chrome, firefox and safari too, but naturally it don't work on Internet Explorer. This is my code

    <g>
        <path fill="none" d="M254.587,356.68
             c0-31.728,25.72-57.448,57.448-57.448c31.728,0,57.448,25.721,57.448,57.448c0,31.728-25.721,57.448-57.448,57.448
            C280.307,414.128,254.587,388.408,254.587,356.68">
            <animate id="cerchio" attributeName="stroke-dashoffset" from="0" to="0" dur="3s"
                begin="startAnimation1.click+1.0s"
                fill="freeze" keySplines="0 0 0 0" calcMode="linear"/>
        </path>
    </g>

I tried to use svgweb but it seems don't work with stroke-dashoffset attributeName. Any ideas?

jury89
  • 302
  • 3
  • 16

1 Answers1

1

IE9 supports SVG. Use VML for IE8 and below.

To check if your browser supports SVG or VML take a look at this answer.

Community
  • 1
  • 1
Ashwin Krishnamurthy
  • 3,750
  • 3
  • 27
  • 49
  • unfortunately i have to use svg! – jury89 Jun 21 '12 at 14:04
  • Then i suggest that you switch to cross-browser friendly raphael.js (http://raphaeljs.com/) or some such library which works for both svg and vml instead of using pure svg. – Ashwin Krishnamurthy Jun 21 '12 at 14:07
  • i consider it...i look for raphaeljs's examples but i didn't find anything that use stroke-dashoffset attributeName...do you know something about it? – jury89 Jun 21 '12 at 14:11
  • Well i have used raphaeljs, so i know for a fact that your attributes can be set using the `attr` function, check out http://raphaeljs.com/reference.html#Element.attr. However, i havent really used stroke-dashoffset attribute before so i'm afraid thats all the help i can offer you regarding this. – Ashwin Krishnamurthy Jun 21 '12 at 14:13
  • but ie9 and ie10 do not support the animate tag, which was the question. svgweb supports the animate tag for ie<9. works fine in ie8. – commonpike Mar 18 '13 at 20:46