OLD | NEW |
---|---|
(Empty) | |
1 <!DOCTYPE html> | |
2 <style> | |
3 div { | |
4 width: 100px; | |
5 height: 100px; | |
6 border: solid; | |
7 margin: 50px; | |
8 position: absolute; | |
9 will-change: transform; | |
10 } | |
11 | |
12 #test { | |
13 border-color: green; | |
14 | |
15 animation-name: anim; | |
16 animation-duration: 2e10s; | |
17 animation-delay: -1e10s; | |
18 animation-fill-mode: forwards; | |
19 animation-timing-function: linear; | |
20 } | |
21 | |
22 @keyframes anim { | |
23 from { | |
24 transform: skew(-45deg, 45deg); | |
25 } | |
26 to { | |
27 transform: skew(-45deg, 45deg); | |
28 } | |
29 } | |
30 </style> | |
31 | |
32 The green test div should transform to cover the red target. | |
alancutter (OOO until 2018)
2015/09/03 05:23:11
This text seems out of date as there's no red expe
| |
33 <div id="test"></div> | |
OLD | NEW |