Make a lightbox clickable

Hello everyone!

I’m here to find THE solution to this problem that never seems to have been solved (I’ve looked at all the forum topics since 2016…)

Please help me!

Here’s my shared link: Webflow - New site - EN COURS

on the “directors” page, I have a list of the directors of my site. When you hover over their name, a video appears in the background. I’d like to be able to simply click on the director’s name to open a page dedicated to the director’s work (this may or may not be a CMS page), while keeping the video animated behind it.

After much research, I know that a lighbox can’t have a clickable link, but I’m desperate because that’s exactly the effect I’m looking for… Do you have an idea for this? A line of code maybe…?

Here’s an example of a site that reproduces this perfectly: TALENTS - ADDICT

I’ve been using webflow for 2 years, I’m still a beginner because I do basic things but I’m willing to do anything to achieve this! Please help me!

Thank you very much!

Here is my site Read-Only: ** Webflow - New site - EN COURS **

Hi Deborah,

Just a note, I’m getting a solid black overlay when clicking one of the names. The browser appears to be trying to load something that’s not responding - so I can’t see your content arrangement.

However, there aren’t any restrictions to links inside of modals or overlays. If you’re trying to use the native Webflow lightbox element, then yes you’d be limited, it’s designed only to show media elements. But if you create your own overlay element using interactions you would not have those limitations.

If you want next-prev capabilities when the overlay is open, I’d probably look at a 3rd party solution like fancybox.

1 Like

Hi Michael,

Thanks for your reply!

Yes, I don’t know why in preview mode you can’t see the videos in suvorl, you only see them when the site is published. You can see the page here: Work C - Filmax - Webflow HTML website template

I’m far from being a pro and very comfortable with interactions but I’ll try your method by creating my own overlay element. If you ever have any step-by-step instructions, I’d love to hear from you! (because right now I’m working from a template I bought).

As a reminder (in case the link above isn’t visible), I’d like to create a text that both opens a page on my site when clicked on and displays a video in the background when hovered over.

Thanks again for your help!

Hi everyone,

I solved the problem! I’m putting it here because I’ve seen the question in several topics:

I turned my lightbox into a div, then deleted the lightbox and turned my div into a linkbox. I then reconnected all my interractions.

It was finally so simple… I’m closing the topic!