Streaming live at 10am (PST)

How to create colored hover effect


#1

Anyone knows how to create colored hover effect with multiple elements (icons, text, buttons on colored transparent object)

like in this case:
http://palkomedia.webflow.com/#portfolio

thank you!


#2

Hi, I have done this using interactions (see my response to your other question for a screen grab). If you make a div for the feature box and then put your image into it and also a div with your overlay colour. Set the overlay colour to 0% opacity and then create a hover interaction that will chang the opacity of the coloured div to 100% (or whatever percentage you like), on hover off set it to 0% again.

You can add multiple hover triggers to the interaction to do other things like increasing the image size (make sure overflow is hidden).

John


#3

I am still unclear on how to do this, can someone give me some screen grabs with more detailed instructions?

Abbey


#5