Button over image that changes the image

Hello,

I wanted to have a large image, and a button below it that would change the image that is above. Is the best way about doing this using the image element and the button element? or is a slider recommended to do this? Just wondering as there seems to be a few approaches what one might be better than the other - or what would be easier to do without custom development?

THanks

So I seemed to have tackled this with slider (stacked) using the custom attribute data-x-slide-goto=“X”

I have 4 buttons at the bottom now and each button would change an image. But is it possible for the button color background to be different for the one that is currently selected? eg:

I have this now -> https://www.screencast.com/t/A3upyhnUSkaB

but I want it like this … https://www.screencast.com/t/ysyqcW3xNukb

Thanks - and is this the suggested best practice to doing this so far?

This is where i’m at now … not sure if this is the best practice still - but can you tell me why when you click on “Unique Feature” it goes white (like the background should) but the text doesn’t go black even though I have in the css the !important tag?

url in secure note

I solved it by using: -webkit-text-fill-color: #000;

I’m not sure if that is the best way? but i’ll let you make any final comments. the way it looks now is the way it should be - just is this the best way?

Hi @garlicfox,

Glad that you are able to find the solution.

Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.