title: Alter or generate and then remove a css3 keyframe
body: <p>I'm currently working on a project with sencha. In this project i have a rotating 'wheeloffortune' wheel that spins to a certain part of the wheel to get your bonus.</p>
  
  <p>I did this before with some javascript where i created intervals to switch the css class of the div but that didn't work well.</p>
  
  <p>I now want to do it with css3 animation for which i have the following css:</p>
  
  <pre><code>    @-webkit-keyframes rotater {
      from {
          -webkit-transform: rotate(0deg);
      }
      to {
          -webkit-transform: rotate(3600deg);
      }
  }
  
  .css3-rotaterFull {
      -webkit-animation-name: rotater;
      -webkit-animation-iteration-count: 1;
      -webkit-animation-timing-function:ease-out;
      -webkit-animation-duration: 15s;
  }
  </code></pre>
  
  <p>But i need to spin it to a certain angle which is variable. therefor i need to be able to set the </p>
  
  <pre><code>to {
      -webkit-transform: rotate(3600deg);
  }
  </code></pre>
  
  <p>part to a variable number of degrees before i add the class to the div</p>
  
  <p>Any idea on how to do this ?</p>