| <?xml version="1.0" encoding="UTF-8" standalone="no" ?> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head> |
| <title>Moving sub-trees</title> |
| </head> |
| |
| <body> |
| <svg xmlns="http://www.w3.org/2000/svg" width="200px" height="200px"> |
| <rect x="0" y="0" width="199" height="199" |
| style="fill: none; stroke: black"/> |
| <g> |
| <!-- background rect to track progress --> |
| <rect x="0" y="80" width="100" height="40" fill="royalblue" |
| stroke="black" stroke-width="1"/> |
| </g> |
| </svg> |
| <!-- Second animation --> |
| <svg xmlns="http://www.w3.org/2000/svg" width="200px" height="200px"> |
| <rect x="0" y="0" width="199" height="199" |
| style="fill: none; stroke: black"/> |
| <g id="new-parent"> |
| <!-- background rect to track progress --> |
| <rect x="0" y="80" width="100" height="40" fill="greenyellow" |
| stroke="black" stroke-width="1"/> |
| <!-- circle to transfer --> |
| <circle cx="100" cy="100" r="15" fill="skyblue" stroke="black" |
| stroke-width="1" id="circle-to-move"/> |
| </g> |
| </svg> |
| </body> |
| </html> |
