Newbie Question - What's the logic for image and text switching on a mouse over?

William_Lee · March 12, 2021, 7:40am

Hi if I just want to have an Image or Text replacement effect when a mouse over event occurs what is the best way to do this in the logic builder?

image_swap_0 image_swap_1

shaun_brown · March 12, 2021, 8:44am

This should help you:

Dima · March 12, 2021, 9:13am

Hello @William_Lee

You can use Mouse Over/Out handlers and logic from the screenshot to do it.

Here you can see how it works - click

Regards, Dima.

William_Lee · March 12, 2021, 11:12am

Hi Dima thanks for your help.

What is the syntax that I need to have in the Image src property value?

My image url is the following.

I’m looking at your image example and I just used your “data:image…” prefix example.

I tried to duplicate your syntax from what I saw and came up with this string below but it didn’t work. Also why did you call the property “src” and not “URL”?

data:image/png;base64,/9j/721AC780-A565-8D74-FF75-5158A2EB5500/console/xhwqervnfxkstszgamvzdcszjeakwodopcfv/files/view/images/icons/footer/welcome_180b.png

By the way is this the proper way to set a text color property? Of is there some additional syntax that I need to add into it as well? It didn’t work in changing the text color when I tried to do a mouse over on that block control.

Thanks for helping me to clear this up!

Dima · March 12, 2021, 2:21pm

Default link of image - ‘https://imagelink.com’
My base64 image is just for example.
Why src - because native html image have src property - link.

For setting styles you need another block - Style of

Regards, Dima.

William_Lee · March 13, 2021, 7:37am

Ok I got that to work but now I need to get the right logic syntax for a block’s border color. Can you please tell me what I’m doing wrong here? Thanks!

mark-piller · March 13, 2021, 2:54pm

Hi William,

This should do it:

When you set styles, the property names (such as border in my screenshot) are standard CSS styles. Here’s the doc for border:

Regards,
Mark