Questions tagged [smil]

SMIL (Synchronized Multimedia Integration Language) is a XML markup language for describing multimedia presentations.

SMIL implementations are available for RealPlayer, Firefox, Opera, Internet Explorer 5-8, Chrome/Safari desktop and mobile handsets with MMS support. FakeSmile is a JavaScript shim which provides support in IE9+.

205 questions
39
votes
1 answer

Deprecated SMIL SVG animation replaced with CSS or Web animations effects (hover, click)

In accordance with this topic: Firefox 38-40 SMIL problems - very slow speed (resolved in FF version 41 from 22.09.15) and this topic: Intent to deprecate: SMIL SVG tag 'animateTransform' does not work well. It would be nice to replace SMIL…
Artem.Borysov
  • 1,001
  • 2
  • 11
  • 26
30
votes
3 answers

How to loop SVG animation sequence?

I have sequence of animationTransform:
serg
  • 103,023
  • 70
  • 299
  • 324
12
votes
4 answers

SVG animate with dynamically added elements

Based on this code, I'm trying to animate a dynamically-generated SVG element: var svgnode = document.createElementNS('http://www.w3.org/2000/svg','svg'); var circle =…
Hendekagon
  • 4,405
  • 2
  • 25
  • 42
10
votes
2 answers

Is SMIL for SVG deprecated, un-deprecated or... paused but will eventually be deprecated?

TLDR: I'm trying to establish whether it's worth spending some time mastering SMIL. The official line (at least from Blink, but maybe not from Gecko) appears to be that this animation technology is functionally deprecated... but the reality on the…
Rounin
  • 21,349
  • 4
  • 53
  • 69
9
votes
4 answers

using the tag in SVG to change the rotation of a shape

I am trying to set the rotated angle of a shape using the tag but for the life of me I cant figure it out. What is the right syntax?
Doug Miller
  • 1,156
  • 4
  • 20
  • 43
6
votes
1 answer

How to add ease-out effect to SVG

I am animating a SVG with the help of SMIL. All works as expected in chrome except that I want to add an "ease-out" effect to the animatemotion tag. Right now the plane moves along the path in a linear fashion. What I want is that the animation has…
Ali Farooq
  • 115
  • 1
  • 10
6
votes
2 answers

Animation in SMIL

Does anyone have resources for learning animation in SMIL?
Meihua
  • 602
  • 1
  • 9
  • 22
6
votes
0 answers

SVG SMIL animation breaks on repeat in Safari

I'm using SMIL for the animation, and javascript to add/remove a class and trigger the toggle. Everything works fine in Chrome, but it falls apart in Safari. The animation works in Safari on the first toggle, but then breaks, only firing off some…
6
votes
1 answer

Controlling SVG's SMIL with JavaScript

Let's say I have this SVG of an insect. Unless it is otherwise impossible this way, I want to insert it as or tags. Now, the insect.svg has two animations: one for walking and other for flying. I'd like to start/stop these…
ArtPulse
  • 335
  • 3
  • 15
5
votes
1 answer

how to start an animation on the end of another animation?

I am trying to have a dot fade from white to red and then from white to red. This is what I have thus far:
Phil
  • 10,007
  • 15
  • 62
  • 93
5
votes
1 answer

Why is SVG SMIL animation not supported by Internet Explorer

Is there a reason why Internet Explorer chose not to support SMIL Animations? Will future versions of Internet Explorer support SMIL animations? http://caniuse.com/#feat=svg-smil
cport1
  • 1,145
  • 14
  • 25
5
votes
1 answer

How to efficiently reverse SVG (SMIL) Animation on Motion Path?

I am trying to determine how to efficiently reverse this SVG animation (with SMIL) which uses animateMotion and the d attribute on the path element. I need the animation to run counterclockwise around the shape. The current animation can be found…
jjdewitt
  • 51
  • 1
  • 4
5
votes
1 answer

using dynamic smil file with jw player

I'm trying to make a online stream player with JW Player 6. If I create a smil file with all the quality version of streams and use the code below it works fine: