| <style> |
| html, body { |
| margin: 0; |
| padding: 0; |
| } |
| svg { |
| overflow: visible; |
| width: 100px; |
| height: 100px; |
| } |
| div { |
| position: absolute; |
| left: 200px; |
| width: 100px; |
| height: 100px; |
| background-color: green; |
| z-index: 1; |
| } |
| </style> |
| <body> |
| <div></div> |
| <svg> |
| <rect x="100"width="100" height="100" fill="red"/> |
| <rect x="200"width="100" height="100" fill="blue"/> |
| </svg> |
| <script> |
| function moveSVGElement(element, x, y) { |
| element.setAttribute('x', x); |
| element.setAttribute('y', y); |
| } |
| |
| function moveHTMLElement(rect, x, y) { |
| element.style.left = x + 'px'; |
| element.style.top = y + 'px'; |
| } |
| |
| var element = document.elementFromPoint(150, 50); |
| if (element instanceof SVGRectElement) |
| moveSVGElement(element, 0, 0); |
| |
| element = document.elementFromPoint(250, 50); |
| if (element instanceof HTMLDivElement) |
| moveHTMLElement(element, 100, 0); |
| </script> |
| </body> |
