Rotation: Difference between revisions
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
<div class="rotate">[[File: | [[File:Maxwell.gif]] | ||
{{Tombox | text = <div class="spin">I am currently in rotation.</div> | image = <div class="rotate">[[File:InfoTom.png|40px]]</div>}} | |||
{{#css: | {{#css: | ||
| Line 8: | Line 10: | ||
animation-iteration-count: infinite; | animation-iteration-count: infinite; | ||
animation-timing-function: linear; | animation-timing-function: linear; | ||
transform-origin: | transform-origin: 20px 20px; | ||
} | |||
.spin { | |||
animation-duration: 6s; | |||
animation-name: spin; | |||
animation-iteration-count: infinite; | |||
animation-timing-function: linear; | |||
transform-origin: 5.5em; | |||
} | } | ||
| Line 19: | Line 29: | ||
100% { | 100% { | ||
transform: rotate(1turn); | transform: rotate(1turn); | ||
} | |||
} | |||
@keyframes spin { | |||
0% { | |||
transform: rotateY(0); | |||
} | |||
100% { | |||
transform: rotateY(1turn); | |||
} | } | ||