Background-color transition stops working after adding click interaction

Design help Animations & Interactions
1

Hi

Here is the link to the website I just started working on. I am very new to Webflow.

My problem:

  1. Put background-color transition on “Burger Menu”
  2. Put click interactions on “Burger Menu”
  3. Background-color transition on hover does not work anymore
  4. Background-color transition on hover works again when I disable the click interactions on “Burger Menu”

Does anyone know what causes this and how to avoid this?

2

OK

I found a solution. It was rather simple. I just put an extra div block inside the Hamburger Menu.
The transition is now applied to “Hamburger Menu”.
The click interaction is now applied to “Hamburger Icon”.

1 Like
3

Hey @skroll Great that you solved this. You may want to change you interactions from to onclick to on navbar so that if someone click another element outside the nav, it would still work. Great concept you are working on here.

4

Hi @AlexManyeki Thanks for pointing me to the on navbar option. I hadn’t noticed it was available to use!

1 Like
5

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.