How to make the underline-reveal fixed to menu item selection

Hi people,

I've been using the DU Header plugin for a website. It's an excellent product. Thank you.

However, I would like to make the underline-reveal fixed upon selection. So when you click on a menu item, the underline remains while you're on that page. I would like to do this for UX reasons.

Is there an easy way to do this with the DU Header plugin?

Any help would be greatly appreciated.

Best wishes
Simon

 

Hi,

That's amazing. Thank you.

Is there any way to adjust the above snippet for hover style 2? Or would that require a different snippet? Would like to play around with ideas.

Thank you very much in advance.

Best wishes
Simon

 

That works lovely. Thank you.

Sorry to keep asking questions.

But is there any way to reduce the padding (of the box) for style two?

Many thanks in advance.

 

UPDATE:

I've worked out how to adjust the padding for the active menu highlight.

Just need to adjust the padding for the hover highlight (15px).

If you could point me in the right direction, that would be awesome.

 

Hello,

Sorry for the late reply. Been on holiday. I hope you all had an excellent festive season and a great start to the new year.

Thank you very much for the above solution. It's very helpful.

There is just one more thing I need assistance with. How can I edit the size of the highlight box when going 'off-hover' i.e. when the cursor is taken off the element?

So it's the right size when the cursor hovers over, but when you remove the cursor, the highlight reverts to original size.

Thank you in advance.

Best wishes
Simon

 

Hi,

Thank you for that. It works a treat.

I'll keep this thread open for a while just in case anything else crops up. If everything remains okay, I'll resolve.

Once again, thank you very much for the assistance.

Best wishes
Simon