Parent Hover field

Many options in Greenshift have a special field for parent hover.

What does this mean?

Imagine that you have text inside the box. Now, you want to have a hover effect that changes the color of the box and you need to change the color of the text also. But if you set the hover color for text, it will be changed only if the user hovers over text.

See example

Hover over text or box

When you hover over box, it’s changed but text color remains the same.

So, what we need is Parent Hover. When we hover over box, text color will get also hover trigger.

Try correct example

Hover over text or box

Hover parent field has quick action. Once you click on it, plugin will detect closest parent container and set special hover class to it and attach it to field.

You can also do this by yourself if you add special class to one of parent element and add the same class name in field

Parent hover in Classes and Element block

In classes and Element block we have another interface. So, to enable this feature, enable hover state and then click on Target icon

Screenshot

Here you need to set manually class or selector that will be used as parent hover. Click on map icon, this will show whole tree of blocks where you can select proper block. Or put there selector manually

Advanced Hover Effect in Animations

You can also use Animation panel to add advanced hover effects in few clicks

«
»