<!DOCTYPE html> | |
<style> | |
div { | |
width: 100px; | |
height: 100px; | |
border: solid; | |
margin: 50px; | |
position: absolute; | |
will-change: transform; | |
} | |
#test { | |
border-color: green; | |
animation-name: anim; | |
animation-duration: 2e10s; | |
animation-delay: -1e10s; | |
animation-fill-mode: forwards; | |
animation-timing-function: linear; | |
} | |
@keyframes anim { | |
from { | |
transform: skew(-45deg, 45deg); | |
} | |
to { | |
transform: skew(-45deg, 45deg); | |
} | |
} | |
</style> | |
<div id="test"></div> |