offset-distance-002.html (683B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Motion Path: offset-distance</title> 5 <link rel="help" href="https://drafts.fxtf.org/motion-1/#calculating-the-computed-distance-along-a-path"> 6 <link rel="match" href="offset-distance-ref.html"> 7 <meta name="assert" content="This tests used offset-distance when offset-path is a closed loop."> 8 <style> 9 #target { 10 position: absolute; 11 width: 100px; 12 height: 40px; 13 background-color: lime; 14 transform-origin: 0% 0%; 15 offset-path: path('m 0 0 h 200 v 150 z'); 16 offset-distance: 120%; 17 } 18 </style> 19 </head> 20 <body> 21 <div id="target"></div> 22 </body> 23 </html>