hi.
I was trying to make scroll snapping for my website, and I’m having some trouble with onViewportEnter function.
here is my code
//there are two boxes named “TopAnker n” and “BottomAnker n” in every strip
export function TopAnker1_viewportEnter(event) {
$w( ‘#TopAnker1’ ).scrollTo();
$w( ‘#BottomAnker1’ ).hide();
}
export function BottomAnker1_viewportEnter(event) {
$w( ‘#TopAnker1’ ).hide();
$w( ‘#TopAnker1’ ).scrollTo().then(() => {
$w( ‘#TopAnker1’ ).show();
});
}
export function TopAnker2_viewportEnter(event) {
$w( ‘#TopAnker2’ ).scrollTo().then(() => {
setTimeout( function () {$w( ‘#BottomAnker1’ ).show()}, 1000 );
});
$w( ‘#BottomAnker2’ ).hide();
}
This worked fine in the preview mode, but when I published the website, “BottomAnker1_viewportEnter(event)” function triggered after “TopAnker2_viewportEnter(event)” function triggered, despite that “BottomAnker1” wasn’t even in the viewport.
here is the website:
https://etoilefes2020.wixsite.com/my-site
(sorry for the bad English)