mirror of
https://repo.dactyloidae.xyz/Dactyloidae/UXP.git
synced 2026-09-28 03:17:31 +09:00
61 lines
2.2 KiB
XML
61 lines
2.2 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
class="reftest-wait">
|
|
<script xlink:href="../smil-util.js" type="text/javascript"/>
|
|
<script type="text/javascript">
|
|
function doTest() {
|
|
setTimeAndSnapshot(101, true);
|
|
}
|
|
window.addEventListener("MozReftestInvalidate", doTest, false);
|
|
</script>
|
|
|
|
<!-- Big green background to match lime.svg -->
|
|
<rect fill="lime" width="100%" height="100%" />
|
|
|
|
<!-- In the following pairs of rects, the only pairwise differences are the
|
|
fill-color and the presence of the "to" attribute on the animateMotion
|
|
element. "to" shouldn't have any effect in these cases, since it has
|
|
lower priority than "values," "path," and "mpath". So in each case, the
|
|
lime rect should cover up the red rect at all times. -->
|
|
|
|
<!-- Single-point path specified with "values" attribute: -->
|
|
<g transform="translate(0,0)">
|
|
<rect width="20" height="20" fill="red">
|
|
<animateMotion values="20,0" dur="2" begin="100"/>
|
|
</rect>
|
|
<rect width="20" height="20" fill="lime">
|
|
<animateMotion values="20,0" dur="2" to="-50,0" begin="100"/>
|
|
</rect>
|
|
</g>
|
|
|
|
<!-- Multi-point path specified with "values" attribute: -->
|
|
<g transform="translate(0,30)">
|
|
<rect width="20" height="20" fill="red">
|
|
<animateMotion values="20,0; 80,0" dur="2" begin="100"/>
|
|
</rect>
|
|
<rect width="20" height="20" fill="lime">
|
|
<animateMotion values="20,0; 80,0" dur="2" to="-50,0" begin="100"/>
|
|
</rect>
|
|
</g>
|
|
|
|
<!-- Path specified with "path" attribute: -->
|
|
<g transform="translate(0,60)">
|
|
<rect width="20" height="20" fill="red">
|
|
<animateMotion path="m0,0 h100" dur="2" begin="100"/>
|
|
</rect>
|
|
<rect width="20" height="20" fill="lime">
|
|
<animateMotion path="m0,0 h100" dur="2" to="-50,0" begin="100"/>
|
|
</rect>
|
|
</g>
|
|
|
|
<!-- Path specified with "mpath" subelement: -->
|
|
<path id="p" d="m0,0 h100"/>
|
|
<g transform="translate(0,90)">
|
|
<rect width="20" height="20" fill="red">
|
|
<animateMotion dur="2" begin="100"><mpath xlink:href="#p"/></animateMotion>
|
|
</rect>
|
|
<rect width="20" height="20" fill="lime">
|
|
<animateMotion dur="2" to="-50,0" begin="100"><mpath xlink:href="#p"/></animateMotion>
|
|
</rect>
|
|
</g>
|
|
</svg>
|
