SVG SMIL アニメーション

- REC

アニメーション要素を使用して SVG 画像をアニメーションする方法

Chrome

  1. 4:部分的なサポート
  2. 5 - 123:サポートあり
  3. 124:サポートあり
  4. 125 - 127:サポートあり

Edge

  1. 12 - 18:サポートなし(ただしポリフィルが利用可能)
  2. 79 - 123:サポートあり
  3. 124:サポートあり

Safari

  1. 3.1 - 3.2:サポートなし(ただしポリフィルが利用可能)
  2. 4 - 5.1:部分的なサポート
  3. 6 - 17.3:サポートあり
  4. 17.4:サポートあり
  5. 17.5 - TP:サポートあり

Firefox

  1. 2 - 3.6:サポートなし(ただしポリフィルが利用可能)
  2. 4 - 124:サポートあり
  3. 125:サポートあり
  4. 126 - 128:サポートあり

Opera

  1. 9 - 108:サポートあり
  2. 109:サポートあり

IE

  1. 5.5:サポートなし
  2. 6 - 10:サポートなし(ただしポリフィルが利用可能)
  3. 11:サポートなし(ただしポリフィルが利用可能)

Chrome for Android

  1. 124:サポートあり

Safari on iOS

  1. 3.2 - 5.1:部分的なサポート
  2. 6 - 17.3:サポートあり
  3. 17.4:サポートあり
  4. 17.5:サポートあり

Samsung Internet

  1. 4 - 23:サポートあり
  2. 24:サポートあり

Opera Mini

  1. all:サポートなし

Opera Mobile

  1. 10 - 12.1:サポートあり
  2. 80:サポートあり

UC Browser for Android

  1. 15.5:サポートあり

Android Browser

  1. 2.1 - 2.3:サポートなし
  2. 3 - 4.4.4:サポートあり
  3. 124:サポートあり

Firefox for Android

  1. 125:サポートあり

QQ Browser

  1. 14.9:サポートあり

Baidu Browser

  1. 13.52:サポートあり

KaiOS Browser

  1. 2.5:サポートあり
  2. 3:サポートあり
リソース
SVG WOW の例
MDN Web Docs - SMIL を使用したアニメーション
SVG の SMIL アニメートイベントのポリフィル
SVG で SMIL をサポートする JS ライブラリ
has.js テスト