Please advise me on the Button & Popup

Hi, I’d like to ask you for some advice. I need to put a button on a page that changes color when the mouse is hovered over. It has this function in the Sparkle Button, but when I put an image and text in the button and want to change the color, it doesn’t work properly anymore. Every time the mouse hits the image or text frame, the color reverts to the original. Logically I understand this, but I don’t know how to solve it.

I thought of solving it by creating a Popup. That’s OK, but I’ve run into the problem again that when I scroll and use the Custom Scrolling function under the title, the marked popup continues to scroll and the page stands still. I would need to stop the Popup as well, but I haven’t figured out how to do that.
1 - Custom Scrooling ON - problem. 2 - Custom Scrooling OFF - OK, but I need it to work like this with Custom Scrooling on. I hope you will understand me.
Thank you for your comments.
Here is a link to the video ( 6,5 Mb)

Translated with DeepL Translate: The world's most accurate translator (free version)

Not 100% sure if I understand : you want an image to “be” a button which changes colour on hover?
As far as I experienced so far you need it seperated - an image as a base layer, above your button, filled with no colour and on mouse action/hover your desired colour with or without text, maybe transparent or whatever.

Did I get it right?

Kind Regards,

I’ll send you a piece of the project so you know what I mean.

The way @UweRausB describes is the only way I know how to do this. But be aware that this will not work on mobiles or tablets because there is no hover state!

Thank you for the good reminder. I haven’t started the mobile version yet, but you’re right. It will have to be a normal button where there will be a link to open the page.