Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Animating SVG with CSS Transitions and Transforms Rotating and Scaling SVG

Team Page Bird Page Bird
Team Page Bird Page Bird
17,561 Points
Posted by Team Page Bird Page Bird
Team Page Bird Page Bird
17,561 Points

Is it possible to use the transform properties (like "rotate") without :hover?

I will like one of my svg's animations to start working as soon as I reload the page, without having to actually hover on the icon.

1 Answer

Sascha Bratton
Sascha Bratton
3,671 Points
Sascha Bratton
Sascha Bratton
3,671 Points

Yep, just apply the transform directly to the element selector without the :hover pseudo-selector. It will be rotated when the page loads, without the need to hover on it.