@@ -16,6 +16,8 @@ Former Editor: Shane Stephens, Google,
[email protected] , w3cid 47691
16
16
Former Editor : Eric Willigers, then Google, [email protected] , w3cid 67534
17
17
Test Suite : https://github.com/web-platform-tests/wpt/tree/master/css/motion
18
18
Abstract : Motion path allows authors to position any graphical object and animate it along an author specified path.
19
+ WPT Path Prefix : css/motion/
20
+ WPT Display : closed
19
21
</pre>
20
22
21
23
<pre class=link-defaults>
@@ -224,6 +226,101 @@ Values have the following meanings:
224
226
all values behave as ''<coord-box>/view-box'' .
225
227
</dl>
226
228
229
+ <wpt>
230
+ animation/offset-path-composition.html
231
+ animation/offset-path-interpolation-001.html
232
+ animation/offset-path-interpolation-002.html
233
+ animation/offset-path-interpolation-003.html
234
+ animation/offset-path-interpolation-004.html
235
+ animation/offset-path-interpolation-005.html
236
+ animation/offset-path-interpolation-006.html
237
+ animation/offset-path-interpolation-007.html
238
+ animation/offset-path-interpolation-008.html
239
+ animation/reftests/offset-path-path-interpolation-001.html
240
+ animation/reftests/offset-path-with-transforms-001.html
241
+ change-offset-path.html
242
+ offset-path-coord-box-001.html
243
+ offset-path-coord-box-002.html
244
+ offset-path-coord-box-003.html
245
+ offset-path-coord-box-004.html
246
+ offset-path-huge-angle-deg-001-crash.html
247
+ offset-path-huge-angle-grad-001-crash.html
248
+ offset-path-huge-angle-turn-001-crash.html
249
+ offset-path-ray-001.html
250
+ offset-path-ray-002.html
251
+ offset-path-ray-003.html
252
+ offset-path-ray-004.html
253
+ offset-path-ray-005.html
254
+ offset-path-ray-006.html
255
+ offset-path-ray-007.html
256
+ offset-path-ray-008.html
257
+ offset-path-ray-009.html
258
+ offset-path-ray-010.html
259
+ offset-path-ray-011.html
260
+ offset-path-ray-012.html
261
+ offset-path-ray-013.html
262
+ offset-path-ray-014.html
263
+ offset-path-ray-015.html
264
+ offset-path-ray-016.html
265
+ offset-path-ray-017.html
266
+ offset-path-ray-018.html
267
+ offset-path-ray-019.html
268
+ offset-path-ray-020.html
269
+ offset-path-ray-021.html
270
+ offset-path-ray-022.html
271
+ offset-path-ray-contain-001.html
272
+ offset-path-ray-contain-002.html
273
+ offset-path-ray-contain-003.html
274
+ offset-path-ray-contain-004.html
275
+ offset-path-ray-contain-005.html
276
+ offset-path-shape-circle-001.html
277
+ offset-path-shape-circle-002.html
278
+ offset-path-shape-circle-003.html
279
+ offset-path-shape-circle-004.html
280
+ offset-path-shape-circle-005.html
281
+ offset-path-shape-circle-006.html
282
+ offset-path-shape-circle-007.html
283
+ offset-path-shape-ellipse-001.html
284
+ offset-path-shape-ellipse-002.html
285
+ offset-path-shape-ellipse-003.html
286
+ offset-path-shape-ellipse-004.html
287
+ offset-path-shape-ellipse-005.html
288
+ offset-path-shape-ellipse-006.html
289
+ offset-path-shape-inset-001.html
290
+ offset-path-shape-inset-002.html
291
+ offset-path-shape-polygon-001.html
292
+ offset-path-shape-polygon-002.html
293
+ offset-path-shape-polygon-003.html
294
+ offset-path-shape-rect-001.html
295
+ offset-path-shape-rect-002.html
296
+ offset-path-shape-rect-003.html
297
+ offset-path-shape-shape-001.html
298
+ offset-path-shape-shape-002.html
299
+ offset-path-shape-shape-003.html
300
+ offset-path-shape-xywh-001.html
301
+ offset-path-shape-xywh-002.html
302
+ offset-path-shape-xywh-003.html
303
+ offset-path-string-001.html
304
+ offset-path-string-002.html
305
+ offset-path-url-001.html
306
+ offset-path-url-002.html
307
+ offset-path-url-003.html
308
+ offset-path-url-004.html
309
+ offset-path-url-005.html
310
+ offset-path-url-006.html
311
+ offset-path-url-007.html
312
+ offset-path-url-008.html
313
+ offset-path-url-009.html
314
+ offset-path-url-010.html
315
+ offset-path-url-011.html
316
+ offset-path-url-crash.html
317
+ parsing/offset-path-computed.html
318
+ parsing/offset-path-parsing-invalid.html
319
+ parsing/offset-path-parsing-valid.html
320
+ parsing/offset-path-shape-computed.html
321
+ parsing/offset-path-shape-parsing.html
322
+ </wpt>
323
+
227
324
228
325
<!--
229
326
████████ ███ ██ ██ ███ ███
@@ -368,6 +465,37 @@ Its arguments are:
368
465
similar to other <<basic-shape>> functions.
369
466
</dl>
370
467
468
+ <wpt>
469
+ animation/ray-angle-interpolation-math-functions.html
470
+ offset-path-ray-001.html
471
+ offset-path-ray-002.html
472
+ offset-path-ray-003.html
473
+ offset-path-ray-004.html
474
+ offset-path-ray-005.html
475
+ offset-path-ray-006.html
476
+ offset-path-ray-007.html
477
+ offset-path-ray-008.html
478
+ offset-path-ray-009.html
479
+ offset-path-ray-010.html
480
+ offset-path-ray-011.html
481
+ offset-path-ray-012.html
482
+ offset-path-ray-013.html
483
+ offset-path-ray-014.html
484
+ offset-path-ray-015.html
485
+ offset-path-ray-016.html
486
+ offset-path-ray-017.html
487
+ offset-path-ray-018.html
488
+ offset-path-ray-019.html
489
+ offset-path-ray-020.html
490
+ offset-path-ray-021.html
491
+ offset-path-ray-022.html
492
+ offset-path-ray-contain-001.html
493
+ offset-path-ray-contain-002.html
494
+ offset-path-ray-contain-003.html
495
+ offset-path-ray-contain-004.html
496
+ offset-path-ray-contain-005.html
497
+ </wpt>
498
+
371
499
Issue: all of these examples need to be rewritten.
372
500
373
501
<div class=example>
@@ -617,6 +745,24 @@ the [=offset position=] is.
617
745
618
746
</dl>
619
747
748
+ <wpt>
749
+ animation/offset-distance-composition.html
750
+ animation/offset-distance-interpolation.html
751
+ animation/reftests/offset-distance-interpolation-001.html
752
+ offset-distance-001.html
753
+ offset-distance-002.html
754
+ offset-distance-003.html
755
+ offset-distance-004.html
756
+ offset-distance-005.html
757
+ offset-distance-006.html
758
+ offset-distance-007.html
759
+ offset-distance-008.html
760
+ offset-distance-009.html
761
+ parsing/offset-distance-computed.html
762
+ parsing/offset-distance-parsing-invalid.html
763
+ parsing/offset-distance-parsing-valid.html
764
+ </wpt>
765
+
620
766
Note: By animating the 'offset-distance' ,
621
767
an element can easily trace out a complex path.
622
768
@@ -819,6 +965,13 @@ Values are defined as follows:
819
965
within the box's [=containing block=] .
820
966
</dl>
821
967
968
+ <wpt>
969
+ parsing/offset-position-computed.html
970
+ parsing/offset-position-parsing-invalid.html
971
+ parsing/offset-position-parsing-valid.html
972
+
973
+ </wpt>
974
+
822
975
<div class=example>
823
976
This example shows positioning a box with 'offset-position' .
824
977
@@ -1065,6 +1218,17 @@ Values have the following meanings:
1065
1218
against the element's [=reference box=] .
1066
1219
</dl>
1067
1220
1221
+ <wpt>
1222
+ animation/offset-anchor-composition.html
1223
+ animation/offset-anchor-interpolation.html
1224
+ offset-anchor-transform-box-fill-box-001.html
1225
+ offset-anchor-transform-box-fill-box-002.html
1226
+ offset-anchor-transform-box-fill-box-003.html
1227
+ parsing/offset-anchor-computed.html
1228
+ parsing/offset-anchor-parsing-invalid.html
1229
+ parsing/offset-anchor-parsing-valid.html
1230
+ </wpt>
1231
+
1068
1232
Issue: Which box this is resolved against is being discussed in
1069
1233
<a href="https://github.com/w3c/fxtf-drafts/issues/503">Issue 503</a> .
1070
1234
@@ -1298,6 +1462,21 @@ Values have the following meanings:
1298
1462
it's just ordered to be part of the [=offset transform=] .)
1299
1463
</dl>
1300
1464
1465
+ <wpt>
1466
+ animation/offset-rotate-composition.html
1467
+ animation/offset-rotate-interpolation-math-functions.html
1468
+ animation/offset-rotate-interpolation.html
1469
+ animation/reftests/offset-rotate-interpolation-001.html
1470
+ offset-rotate-001.html
1471
+ offset-rotate-002.html
1472
+ offset-rotate-003.html
1473
+ offset-rotate-004.html
1474
+ offset-rotate-005.html
1475
+ parsing/offset-rotate-computed.html
1476
+ parsing/offset-rotate-parsing-invalid.html
1477
+ parsing/offset-rotate-parsing-valid.html
1478
+ </wpt>
1479
+
1301
1480
<div class=example>
1302
1481
The following examples use the shape of a plane. The red dot in the middle of the shape indicates the <a>anchor point</a> of the shape. When no offset properties are set, the shape is not translated or rotated along the path.
1303
1482
@@ -1424,6 +1603,17 @@ Value: [ <<'offset-position'>>? [ <<'offset-path'>> [ <<'offset-distance'>> || <
1424
1603
Applies to : <a href="https://drafts.csswg.org/css-transforms-1/#transformable-element">transformable elements</a>
1425
1604
</pre>
1426
1605
1606
+ <wpt>
1607
+ animation/offset-interpolation.html
1608
+ animation/offset-position-composition.html
1609
+ animation/offset-position-interpolation.html
1610
+ parsing/offset-parsing-invalid.html
1611
+ parsing/offset-parsing-valid.html
1612
+ parsing/offset-shorthand.html
1613
+ inheritance.html
1614
+ offset-supports-calc.html
1615
+ </wpt>
1616
+
1427
1617
This is a shorthand property for setting 'offset-position' , 'offset-path' , 'offset-distance' , 'offset-rotate' and 'offset-anchor' . Omitted values are set to their initial values.
1428
1618
1429
1619
0 commit comments