-webkit-transform tłumacz wokół centrum

Question

Dla przyjemności Tworzę analogowy zegar: D, ale jak mogę go obrócić wokół centrum? Chcę obrócić to, co pokazuje minuty. jest już umieszczony, wskazując na 15 jak w 15.15, 16.15.

robi zwykły rotate("10deg") wil go obrócić wokół siebie. Zgaduję, że muszę zrobić coś takiego:

$("#minPointer").css("-webkit-transform", "translate(-100px, -100px)"); 
$("#minPointer").css("-webkit-transform", "rotate("+val+"deg)"); 
$("#minPointer").css("-webkit-transform", "translate(100px, 100px)"); 

pin jest umieszczony pośrodku w pudełku 200x200. i powyżej nie działa :(

Answer 1

Zastosowanie -webkit-transform-origin ustawić co punkt przemiany występują w odniesieniu do:

// Replace percentages to reflect what point you want to rotate around. 
// Pixel values are fine. 
$("#minPointer").css("-webkit-transform-origin", "50% 100%"); 
$("#minPointer").css("-webkit-transform", "rotate("+val+"deg)"); 

Answer 2

Musisz użyć transform-origin property

informacji i przykładów. https://developer.mozilla.org/En/CSS/-moz-transform-origin