[Resolved] Different CSS Effects?

[Sean]

I know I’m kind of reaching here, and this honestly has nothing to do with the Themes or the Plugins. But I’m trying to find a way to have several CSS hover effects. Right now, everything on my website will rotate a bit, no matter what I do when I place an image. Which looks super dumb. But it looks super awesome for the Social Media links on the Contact page. I’d prefer just to have the other images to fade to black and white while being hovered over. Is it possible to have multiple effects, like separated by class? I’m very much a noob when it comes to coding. But I definitely know how to use Ctrl C and Ctrl V(lol). I’ve been trying to Google a solution, but it’s rough.

http://sinceday.one

[Sean]

A temporary solution is another plugin, which allows me to do specific page/post CSS. However I’d still like the option to do it per item. So one item on Page A can rotate a little while being hovered over, while a second item also on Page A is fading to grayscale while being hovered over. Etc Etc.

[Tom]

You can give different elements separate CSS classes, and then target them with different transition effects and other attributes.

I couldn’t see anything on your site using transitions though?

[Sean]

That’s what I’m Googling how, how to use my current code and make it into a “class” . I ended up downloading a WP plugin that offers customer CSS per-page. I semi-fixed it. But On the Contact Page, my logo also rotates like the social icons. So in result, I guess I’m going to need to figure out how to make my CSS code I found and make it into a class, if that’s even possible.

http://sinceday.one/contact

[Sean]

Yelp. I just learned how to fiddle around a little bit with CSS. And no Google did not help me lol. I took code that utilizes Classes, and compared it to my code. Only difference was .rotate after img and before hover. Ahhhhh I feel so much better now. Sorry I wasted space here lol.

[Jean Paiva]

I used this collection once, you just need to install on your theme, and your are good to go.

http://ianlunn.github.io/Hover/

[Tom]

Glad you sorted it out! 🙂

[Author]

Posts