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

Posted by Jaco Burger
Jaco Burger
20,807 Points

CSS Post Hover transition state & On Load Trigger

Hi guys. I guess I missed something. Say for instance:

.div {opacity: 0; transition: 2s ease-in}

.div:hover {opacity: 1}

So after the hover trigger, the div fades in, is there a way to keep it that way? It fades back to it's original opacity after the cursor is removed. I know you can set the states with jQuery, but surely there must be a way in pure CSS?

Also, if I want a logo to transform on page load, what trigger must I use?

Thanks!

2 Answers

Kevin Korte
Kevin Korte
28,149 Points

I don't think this is possible with CSS. I can't think of a way to do it. This would be pretty easy to do with JS or Jquery, is there a reason you don't want to use that? Last I read 98% of the internet users have JS enabled. Sounds like this wouldn't break your site if the user didn't have it enabled.

Jaco Burger
Jaco Burger
20,807 Points
Jaco Burger
Jaco Burger
20,807 Points

Okay, thanks :)