Hi…
I am trying to open a lightbox when an anchor is in view.
This is the code:
import wixWindow from 'wix-window';
export function anchor1_viewportEnter(event) {
wixWindow.openLightbox("Lightbox1");
}
“anchor1” and “Lightbox1” are spelled correctly and according to the elements in the page.
What am I doing wrong?
Thank you!
It Will Work in Production;
It will work on your site after Publish;
Make Sure Your Site Page bigger than your Screen width at least 2x
https://muthu35.wixsite.com/mysite/anchor
Closely Watch that Coloured Texts;
And Go for Console;
Actually All Those things are Not Working in Preview Mode;
Thank you!
But unfortunately my page doesn’t work on live as well.
Can you please add your code here?
Here you will learn how to do, what you want to do…
https://russian-dima.wixsite.com/meinewebsite/reading-position
In the example a stripe is used instead of an ANCHOR, to demonstrate better the function. You can combine it with your code.
I expanded this example to a similar situation for your needs…
https://russian-dima.wixsite.com/meinewebsite/lightbox
You will find the code inside the example.
All i added to the existing code is this…
export function anchor1_viewportLeave(event) {
session.setItem('Email', $w("#inputMain").value);
setTimeout(()=>{wixWindow.openLightbox("Lightbox1");},350)
}
Of course you have also to input an anchor onto your page. This is the “onLeave-Event”. That means, when the Anchor leaves the Viewport, an event is fired up.
In this case the Light-Box-Call starts (waits for 0,35sec. and open a Light-Box with the transfering DATA).
Also do not forget to connect your button with the CODE ! ! !
@russian-dima
Thank you Dima but I do not see how this is related to my problem 
I am trying to open a Lightbox when the scroll reaches a certain element on the page…
@contact13073
Have you checked that function is calling while you scroll to that anchor place.
Using console.log(“view port enters”) ??
@contact13073
Have you checked my site ?
In console output you can see like
Viewport entered
Views port leaves .
Have you checked that your function call is happening using console.log ?
Ok, do the following steps:
-check the name of your Lightbox —> Lightbox1 that is correct?
-delete your anchor and add a new one → give it the following ID → anchor1
-do NOT connect the anchor with the code (already done in the code)!
-put in the following code into the CODE-section of your choosen page
-check one more time the position of your anchor (does it leave and enters the viewport, when do some scrolling)?
After everything is checked, test the action in LIVE-MODE.
import wixWindow from 'wix-window';
$w.onReady(function () {
$w('#anchor1').onViewportEnter(()=>{
wixWindow.openLightbox("Lightbox1");
console.log("Vieport entered")
})
});
Take a look into console (as already mentioned by Er.Muthu).
Press F-12 on your Keyboard (if using google-chrome) and go to the CONSOLE.
While doing some action on the site, take carefully a look onto the output of CONSOLE. You should see —> “Viewport entered”
If not something is setted wrong.
Thank you for both of you.
The console indicates the viewport entered but writes:
There is no lightbox with the title “lightbox1”
But this is exactly the ID of my lightbox:
@russian-dima
This will work I guess
I hope ^^. Normaly it should, if there are no other reasons, why it should’t work 
@russian-dima
Actually I tried myself after reading this issue.
It’s working perfectly fine for me in live (only)
@muthu
We wait for the result of the post-opener.
I am sure he will make it work.
Nor working either… 
There is no lightbox with the title “Lightbox1”
Ok, than try to delete your lightbox and create a new one.
And remember, this just work in LIVE NOT in Preview-Mode!
You should also show your current full-code.
@russian-dima
Try with different name and id of light box
Like 'contactUsLightbox"