Edit Question - KnowledgeHub

Title Body

I am trying to create an interactive SVG code with JavaScript, by embedding the JavaScript in the SVG. I don't know if this is the right way to do this: <?xml version="1.0" encoding="UTF-8" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg" onkeypress="move()"> <script type="text/javascript"> <![CDATA[ var x; var y; function move() { x = new Number(svg.getElementsByTagName("circle")[0].getAttribute("cx")); y = new Number (svg.getElementsByTagName("circle")[0].getAttribute("cy")); switch (event.keyCode) { case 119: y--; y = y.toString(); svg.getElementsByTagName("circle").setAttribute("cy",y); break; case 115: y++; y = y.toString(); svg.getElementsByTagName("circle").setAttribute("cy",y); break; case 97: x--; x = x.toString(); svg.getElementsByTagName("circle").setAttribute("cx",x); break; case 100: x++; x = x.toString(); svg.getElementsByTagName("circle").setAttribute("cx",x); break; default: } } ]]> </script> <rect x="0" y="0" height="500" width="500" style="stroke-width:1; stroke:black; fill:white"></rect> <circle cx="250" cy="250" r="50" stroke="red" stroke-width="1" fill="red"></circle> </svg> It is supposed to have a ball that moves with wasd, but the ball doesn't move. What am I doing wrong?

Tags (comma-separated) Cancel