0

I want to use SVG graphics in order to display a AJAX loading spinner. This is animated using CSS animation, and it is changing SVG attributes in CSS.

For example, here is some parts of this code:

@keyframes dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -35px;
  }
  100% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -124px;
  }
}

You can have a look at that here: https://codepen.io/jczimm/pen/vEBpoL

But the problem is I'm afraid of browsers that may not support this feature (I mean controlling SVG attributes via CSS). I could not find any specific resource to find out which browser support such feature.

Can anyone provide any resources or more information about that?

Edit

I have to repeat my question, because of some misunderstandings:

Which browsers support changing attributes of SVG elements using CSS?

Ahmad
  • 5,551
  • 8
  • 41
  • 57
  • http://caniuse.com/#feat=svg – Marcos Pérez Gude Jul 08 '16 at 12:37
  • `I could not find any specific resource to find out which browser support such feature` This means that you didn't search before. There are exact duplicated posts in stackoverflow, and more than 488.000 results in google. – Marcos Pérez Gude Jul 08 '16 at 12:39
  • Possible duplicate of [.SVG Browser Support](http://stackoverflow.com/questions/8926285/svg-browser-support) – Marcos Pérez Gude Jul 08 '16 at 12:39
  • Hey guys, I'm not asking about support of SVG itself, but using CSS to change its attributes. – Ahmad Jul 08 '16 at 12:40
  • Apply CSS to SVG element is supported by this table http://caniuse.com/#feat=svg . For supporting animations is different, as @makshh said you can see compatibility http://caniuse.com/#feat=svg-smil – Marcos Pérez Gude Jul 08 '16 at 12:47
  • IE does not support CSS animation of SVG, other browsers do. It does support the CSS attributes themselves so you could animate them with javascript. On the whole wouldn't it be easier if you just tried it yourself? – Robert Longson Jul 08 '16 at 12:58
  • @RobertLongson It is not so easy to find out which versions of browsers support it. – Ahmad Jul 08 '16 at 13:05
  • @RobertLongson I have latest versions of browsers, and most of them support it, now how can I know about previous versions? – Ahmad Jul 08 '16 at 13:08

0 Answers0