title: need to divide circle image to 8 part, and put label on each part. pressing label will turn the circle to the divided part
body: <p>I have a circle image (like a roulette template), and I need to split it to 8, and put label on each part. when pressing on divided part, I need the circle will point on the correct part.</p>
  
  <p>this is jsfiddle of what I have in a mean time:
  <a href="http://jsfiddle.net/EYALIN/x8q9nqt1/" rel="nofollow">http://jsfiddle.net/EYALIN/x8q9nqt1/</a></p>
  
  <p>this is JS:</p>
  
  <pre><code>var img = document.querySelector('img');
  img.addEventListener('click', onClick, false);
  
  
  function onClick() {
      this.removeAttribute('style');
  
      var deg = 500 + Math.round(Math.random() * 500);
  
      var css = '-webkit-transform: rotate(' + deg + 'deg);';
  
      this.setAttribute(
          'style', css
      );
  }
  </code></pre>