@ApplePieGiraffe
Posted
Hey, Nicholas! 👋
Nice job on this challenge! 👍 Those animations on the SVG circles are definitely interesting! 😎
One thing you could do is to use CSS background images to add and place the SVG circles in this challenge. It'll leave your HTML a little cleaner and you might not have to use any media queries to adjust the position of the SVG circles (say, if you position them using viewport units). But, then, implementing that animation might be a little harder to do, so it's just a thought! 😉
Keep coding (and happy coding, too)! 😁
@nicholask98
Posted
Hey @ApplePieGiraffe,
Thanks for the feedback! I will definitely give that a shot today. I don't know how that idea didn't even cross my mind. I'm already at a loss for how I would keep the animation without having the circles be elements in the markup. Do you have any ideas for that?
Thanks! Nicholas
@ApplePieGiraffe
Posted
@nicholask98
I've seen some people use a combination of pseudo-elements and CSS background images to add the circles into this challenge (by adding a single circle SVG as the background for each pseudo-element of the body
or main container). You could try doing that and then changing the position of the pseudo-element when it is hovered over to recreate the animation you already have. That way, you'll keep the background images out of your HTML but still be able to change their position when the element they are attached to is hovered over, I think. But, if you want, you could simply save that idea for another challenge and continue with what you have now since it isn't bad. 😉
Keep coding! 👍
@nicholask98
Posted
@ApplePieGiraffe
Oh of course! I always forget about pseudo-elements. I think I will save that idea for next time just so I can move on to a new project, but thank you so much for your detailed response! I will definitely be referring back to this in the future.
Best, Nick