Click Trigger Section Separare Per Item

Hi everyone,

I have a product page (BEAN PUFF ) where a few products are displayed.

As every product has its own specifications, I created Sections underneath the products so that when the image of one product is clicked, the specifications of the porudct will appear below and when you click again, it wil dissapear.

One of the challenges I have is that, these different sections for each product overlap each other. I mean when I create the separate Section, I need to play around with it so that each and every section will appear in the same position.

Could anyone know a way where I can create sections but all of them being in the exact same position?

Also, ideally, when you click each image separately, the previous one should close. Now you will only see 1 product, but there will be 5 different products to display.

Many thanks
Jack

https://preview.webflow.com/preview/jacks-sublime-project-e34-07c2eb8256e37?preview=f8f69a63b8e383585c7394dde0e09f02


Here is my public share link: **LINK**https://preview.webflow.com/preview/jacks-sublime-project-e34-07c2eb8256e37?preview=f8f69a63b8e383585c7394dde0e09f02
(how to access public share link)

Hi. This is not MAGIC :slight_smile: if you want special behavior on your site you need to implement some third-party library (and to know a little JS).

Do you talk about something like this?
http://goldinteractive.github.io/jQuery.GI.TheWall.js/

Maybe you can use tabs (for 5 items it could work - each click will show another description - the tab menu will be with images)

Thank you for the reply.
I think I am after the first link you sent in your reply. May I ask - how can I implement this library on my site?

The problem with TAB is that the ifnormation below the tab appears when you visit the page. Although what I need is that, the tab word to appear but the information TAB PANE to be invisible until the TAB link is clicked. Any chance I can achieve this?

Many thanks

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