Transparent Hover Function on Button Design (Custom Code)

Site URL: https://panda-onion-mbds.squarespace.com/config/

Hello there,

I am trying to find a solution to an issue concerning the button hover design function on a website I'm working on.

When I hover over the text (the button) I created I end up with a white fill box. The text disappears. I made modifications to the button design, which is why I get this issue. On its own it looks fine.

Is there a custom code I can use to A) Keep the text or B) Have the text on a lower opacity when hovering over it? Option C) would be to have the text disappear completely as in the screenshot examples I have attached.

As an alternative solution I tried turning the text into a clickable link as it leads to a photo gallery. However that underlines the text. Any help to a custom code or a work-around would be greatly appreciated. Thank you very much for your help and tips.

Robin

Included attachments:

Metzler Studios is the website I'm working on with the hover issue.

Visualofu the example of how I would like it to look.

can you post the modified code you are using and I can edit and send back to you?

Hello elschwartzo,

Thank you very much for your prompt reply.

I didn't use a modified code I'm afraid. I am rather helpless at coding and would not know where to paste it either without additional help. I only changed the button design in the Styles Page.

Would you be able to help with the coding from scratch?

Thank you very much,

Robin

On 11/28/2024 at 4:02 PM, RobinMetzler said:

Hello elschwartzo,

Thank you very much for your prompt reply.

I didn't use a modified code I'm afraid. I am rather helpless at coding and would not know where to paste it either without additional help. I only changed the button design in the Styles Page.

Would you be able to help with the coding from scratch?

Thank you very much,

Robin

Your site is private, you can follow this to share url correct way.