HOW do I make the pink box go back and forth?

I want to make the pink box go back and forth in the center while the blue box continues to loop. THEN I want to change the boxes out for photos. ANY HELP CORRECTIONS WOULD BE APPRECIATED. Thank you in advance!! Code Below: <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <svg width="1000" height="250"> <rect width="150" height="150" fill="blue"> <animate attributeName="x" from="0" to="350" dur="2s" fill="freeze" repeatCount="indefinite"/> </rect> </svg> <svg width="1000" height="250"> <rect width="150" height="150" fill="magenta"> <animate attributeName="x" from="75" to="125" dur="2s" fill="freeze" <animate attributeName= "x" from "125" to="75" dur="2s" fill= "freeze" > repeatCount="indefinite"/> </rect> </svg> </body> </html>

html css javascript oxford sabrina

26th Jul 2022, 4:48 AM

Sabrina Oxford

3 Answers

+ 3

You just forgot to close animate tag, and you need repeat to both of this animation on pink box. Also remove "from=125" to second animation and it will move back and forth, if you keep it it wont. One tip to dont forget to close tag, indent code in way as I did, it will help you a lot. So when you have lot of properties inside opening tag place tham in new like each. Code is longer but it is easier to work. https://code.sololearn.com/W2Dx8e3AoGTN/?ref=app

26th Jul 2022, 8:42 AM

PanicS

+ 2

Thank you... Learning this by myself is hard but it is nice when I can post it question and someone gives me an answer that actually helps resolve the issue. Thank you for not only explaining what I did wrong but show me how to do it correctly 💕❣️🥰🤗✅ 10000 brownie points for you 🥰🥰🥰🥰

29th Jul 2022, 8:26 PM

Sabrina Oxford

I'm trying to make the pink box go back and forth while the blue box loops. then when I can learn that portion, and what I did wrong, I would like to trade the colored boxes out for photos. any help would be awesome!!!

26th Jul 2022, 4:54 AM

Sabrina Oxford