Hide lightbox when element inside is clicked eventhough is already linked to a page anchor

Ask the community
,
1

I have a lightbox that is triggered by a page menu item. When it opens it displays a 3D carousel gallery. Each image in the gallery is linked to a distinct page anchor and functions correctly when clicked. My issue is I want to make the lightbox disappear when the page scrolls to an anchor after an image in the gallery is clicked. I tried setting onClick event with the gallery but lightbox remains. Here’s the code:

import window from ‘wix-window’ ;

export function gallery31_itemClicked(event) {
//Add your code for this event here:
window.lightbox.close();
}

I suspect that the gallery has a click event in the form of the anchors and they’re conflicting. Anyway, any help is appreciated.

2

Once you moved to another page the lightbox gets closed automatically. No need to close it by code.

3

The anchors are on the same page. On click it scrolls down the page to the appropriate anchor but keeps lightbox visible.

4

On the page use:

wixWindow.openLightbox('LightboxName').then(data => {
 if(data){$w("#" + data.target).scrollTo()}
    })

And in the light add a data object {“target”: “anchor1”} to the close()

https://www.wix.com/corvid/reference/wix-window.html#openLightbox

5

Thanks for the info… looks promising.
Unfortunately I’m so new to this that I’m having trouble comprehending.
If I understand correctly the first part opens the lightbox on load, However, the lightbox will open through user input only. Once open and content is clicked I want to close it automatically. The content being a link to an anchor point on the page.

Is this what you mean for the second part:

window.lightbox.close( { “target” : “anchor1” });

Tried it, no errors but still not closing.