Image changes on multiple selections

I am launching at the end of the month and a feature has been requested by a few people in testing that I can not seem to get to work, this is my first project in Webflow and I think it is fantastic so I hope this cherry can be fitted on top.

The ability to click and not hover (wont work on mobiles) on any of the four colour options and the the single image will change accordingly, I have tried to look at all the threads but cannot find a way forward, the closest I have got is to use select element animation hide and show but I cannot get it to work.

I really would appreciate some help here.


Here is my site Read-Only: **https://preview.webflow.com/preview/shauns-first-project-3fa702?utm_medium=preview_link&utm_source=dashboard&utm_content=shauns-first-project-3fa702&preview=1362c7a88ed225a9de00de6d4e3b8795&mode=preview)

Hi @Shaun,

It is not clear to me what are your intentions or what you wish to accomplish. Might be because I don’t know to which element you refer to… on which page those elements are? which section?

Hi Aviv,
Sorry I should of said the products page and the door samples.
It may be because I am running the main domain live and the subdomain you may only see the landing page, so here is the sub domain live url. https://shauns-first-project-3fa702.webflow.io/products

Also a capture of the door image (on left) to be changed by clicking on the colours on the right.

Is there a reason for the cursor:pointer property on the .Section Doors class?

The easiest way to do this is to use tabs inside the tabs :smiley:
Image%20001

Thanks for the reply, I did look at that I will revisit that suggestion, ,maybe I was looking at it wrongly, I thought the centre column with a light box would be a problem, assuming I can separate the tabs from the tab pane??
Thanks

Thanks,
That was brilliant it worked a treat, just needed a bit of thinking about.