title: Endless rotate of SVG Polygon on mouseover
body: <p>I want to rotate a polygon on mouseover, but all I am able to do is a single rotate, I think because the angle is sort of static.
  also, the polygon should rotate around itself, what it doesn't. My code looks like:</p>
  
  <pre><code>&lt;polygon id="stern"
          points="
          350,370.5  
          370.9,460.1 
          460.9,460.1  
          390.7,510.5
          420.3,600.1
          350  ,550
          270.7,600.1
          300.3,510.5
          230.1,460.1
          320.1,460.1"
          style="fill:#FACC2E"
          onmouseover="rotieren()"/&gt;
  
  &lt;use x="365" y="-380" xlink:href="#stern" transform="scale(0.7)"/&gt;
  &lt;use x="1060" y="400" xlink:href="#stern" transform="scale(0.4)"/&gt;
  &lt;use x="500" y="700" xlink:href="#stern" transform="scale(0.5)"/&gt;
  </code></pre>
  
  <p>I tried many functions, for example to use a variable, but I can't use it in <code>.setAttribute("transform", "rotate(variable,0,0))</code>. Right now, I do</p>
  
  <pre><code>document.getElementByID("stern").setAttribut("transform","rotate(5,1060,400)")
  </code></pre>