Streaming live at 10am (PST)

When hovering over a button, can i trigger movement in an image as well?


#1

I have a tile with an image, some text and a button. I basically want the tile to work in two way when hovering:
1.) I hover over image and it triggers hover state on button and image. 2.) I hover over button and it triggers hover state on button and image.

Can this be done without custom CSS?

Any help is much appreciated.

Nick

(scroll to work section beneath hero image to see what I mean.)


https://preview.webflow.com/preview/nick-quinns-portfolio?preview=497882fb9c4256fce8c2a1d4473510af


#2

Hi @Nicholas_Quinn

If I understand right, this seems achievable without custom code…

  1. Select the button, then go to the interactions panel, add a ‘mouse hover’ interaction
  2. Choose ‘start a new animation’
  3. Add the hover effects you want on the button
  4. Also add hover effects on the image in that same animation
  5. Give the animation a name

Then back in the Designer, select the image, and go to add a ‘mouse hover’ interaction

  • Select the three dots next to the animation you created and ‘duplicate’ it
  • Click the settings cog of that new duplicate
  • Change round the animation settings/effects if needed (and give it a name)

Similar process for the ‘hover out’ too - hope that’s useful ?