CSS3 vlastnosti origin a transition-duration dohromady vytváří efekt plynulého otočení elementu.
div:hover { transform: rotate(360deg); transform-origin: 90% 90%; transition-duration: 1.2s; }
Na závěr jsem si asi dovolil trošku víc.
Vlastnost "transition-origin" se zobrazí jen v případě rotace objektu.
Tato vlastnost určuje střed rotace dle souřadnic x a y (90% 90%). Dají se použít i jiné hodnoty než %.
A jako třešničku jsem přidal i vlastnost "transition-duration", která určuje dobu přechodu.
Dají se použít i další vlastnosti přechodu. Jsou úplně stejné jako u animací. Jen se zamění animation za transition.