Hello, what’s the best way to create an interactive experience like the “Características” section on this website: https://www.roca.es/smart-toilets/productos/in-wash/
When clicking the plus buttons, a container with an image and text shows up. You can close that container when clicking the X button. This works on all breakpoints (also on mobile).
I want to create this experience on a new website using Editor X.
I’m not very familiar with Velo. Also, I guess multi-state-boxes are not supported yet on Editor X?! Maybe there’s a good workaround. I would be very grateful for a useful “how to” response.
Many thanks in advance!
Somewhere, there is a tutorial for this – a video, I think – but I’ve been searching and can’t find it. If I recall correctly, the tutorial uses an example of a campus map. When you hover over a building, a text box appears that describes the building.
Maybe you (or someone else reading this) can find that tutorial.
Meanwhile, to get started, you may find these links to be helpful:
I still haven’t found that tutorial, but I found another one that might help. This shows you how to show and hide a text box using .expand() and .collapse(). For what you’re doing, .show() and .hide() are probably better choices (see my links above), but the code here is very similar.
Many thanks for your comment, Jim - much appreciated. I’ll take a deeper look into it.
