title: Restart background SVG animation
body: <p>I have an SVG set as a background image of an element. The first time the element is displayed, the animation plays correctly.</p>
  
  <p>On subsequent displays (e.g. if a duplicate of the element is injected via JavaScript, or if the background image is removed and added back with CSS/JavaScript), the animation does not start from the beginning. I think this is intended functionality as the image is not considered to have been reloaded by the browser - it uses the in memory version which is already animating.</p>
  
  <p>Here is a demo of this (not mine):
  <a href="http://www.luigifab.info/public/svg-smil/test.html" rel="noreferrer">http://www.luigifab.info/public/svg-smil/test.html</a></p>
  
  <p>There are some associated browser bugs reports for <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=843308" rel="noreferrer">Firefox</a> and <a href="http://code.google.com/p/chromium/issues/detail?id=177277" rel="noreferrer">Chrome</a>, but as above I think this is intended functionality.</p>
  
  <p>Is there any way to get my SVG animation to reset/replay whenever the image is displayed?</p>
  
  <p>I'm ideally looking for a solution using just CSS and SVG - else a solution with JavaScript if this is not possible.</p>