Hover Transition Header Builder

[felixstuermer]

Is it possible to have a smooth Fade Transition on the Header-Builder when Using First and Secondary Image for a Menu-Item?

Startseite - Die Earthgang

[Prasant]

Hello @felixstuermer,

Thanks for asking.

Yes, you can have. I am sharing few resources that you can take a look to implement transition on hover. To do that under Navigation Inline Element > Customize > Class add a custom Class custom-nav-hover-style. https://cl.ly/2i0N1z3y2p2l

After that you can add following CSS under Pro > Theme Options > CSS:

.custom-nav li a:hover {-webkit-transition-property: width; -webkit-transition-duration: 2s; transition-property: width;transition-duration: 2s;opacity: .5;:-ms-transition: opacity 0.5s ease-in-out;-o-transition: opacity 0.5s ease-in-out;transition: opacity 0.5s ease-in-out;}

You can change class name s per your liking. To learn more about CSS animation and effects, please take a look at following resource:

https://www.w3schools.com/css/css3_animations.asp

Using CSS transitions

Thanks.