+ 2

Why my circle is not moving?

;-; https://code.sololearn.com/W5dPEH3767V8/?ref=app

14th Jun 2017, 5:25 PM

Tarif Aziz

4 Answers

+ 5

Because you have made two mistakes: 1> you close implicitly the <circle> element by putting a slash at the end ( <circle cx="100" cy="100" r="100" fill="Red"/> ) 2> in the <animate> element, you give the attribute 'attributeName' the value of 'x', but <circle> element doesn't have, but rather have a 'cx' attribute. Fixed code: <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <svg width="1000" height="1000"> <circle cx="100" cy="100" r="100" fill="Red"> <animate attributeName="cx" from="0" to="200" dur="3s" fill="Freeze" repeatCount="2" /> </circle> </svg> <div style= color:Blue;</div> <p>Hello</p> </body> </html>

14th Jun 2017, 5:51 PM

visph

+ 4

@Tarif Aziz: For the rectangle, the attributes names of position are effectivelly 'x' and 'y', but the circle doesn't share the same, and it's position is given by 'rx' and 'ry' (not very much logical, I grant it ;) )...

15th Jun 2017, 7:24 AM

visph

+ 1

me too i want to know any answer please fork it then mention your code here

14th Jun 2017, 5:47 PM

Abdur-Rahmaan Janhangeer

thanks @visph . I thought the "x" means the coordinate . When I was taking the lesson , I changed the attributeName to y and it moved from up to down. That's the reason why I thought x and y are coordinates :'3(Rectangle)

15th Jun 2017, 6:05 AM

Tarif Aziz