Modal with next / back functionality

Hi there,

I am creating a page where i have a grid of team members. When you click on an image a modal pops up with more info. What i am stuck doing is added next and back buttons within the modal so users can go through team member without closing the modal. Is there a way to do this in webflow?


Thanks in advance.

To create a modal with next and back buttons in Webflow, you can use either interactions or custom JavaScript. Create a modal that displays dynamic content from your CMS Collection, then use JavaScript to cycle through team members when the next and back buttons are clicked. Store the team members in an array and update the modal content (image, name, bio) based on the selected index. Use event listeners for the next and back buttons to adjust the index, then update the modal’s content accordingly. This allows users to navigate through team members without closing the modal.

Hi Alex, not natively.

Effectively you’re building a basic lightbox gallery, however Webflow’s native lightbox only supports media, not text and image content.

Have a look at Fancybox if you want a more capable / customizable lightbox solution.

If your modals are consistently designed, and have a clean triggering process, it would theoretically be possible to create prev/next buttons with script that close the current modal and invoke the previous/next one, but it’s a lot of setup work to construct this and the effect likely won’t look natural as you’d see the modal completely close and then a new modal completely open.