How to add animation to menu?

I am using Beaver Builder, Beaver Themer and Beaver Theme altogether. I want to be able to implement animation to my menu components, specifically fade in/out. I am focusing on the hover option the most, because that’s how I want the animation to react.
Take a look at the examples below, they are like what I’m trying to achieve:
https://giphy.com/gifs/gkWxERmdEWqQGTdzmz
https://giphy.com/gifs/SXCIixHfEPJUeL7GTD

The first one is very smooth and fluid, I am trying to achieve the same type of effect. You will also notice that what can happen if you go too crazy with your mouse, is that it’s starts bugging and lagging, but this doesn’t present a problem for me because as long as it functions smoothly when used normally, I don’t have a problem.

Does anybody know how I can add animation to the menu once you hover over an element?

Check that link for some ideas on how to do it just with CSS

1 Like

Do you know how I would be able to implement this into my menu? Where exactly do I put this CSS code, and how to I add the transitions to work for each title/element in the menu?

I have no coding knowledge, so this is pretty abstract to me