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.
