ViewPortEnter() not working.

Ask the community
,
1

I want the logo on the top left corner of my site to disappear on scrolling down. It disappears but when I scroll back up it doesn’t reappear.
The logo image is pinned.
Here’s the code I used for the element (On Site, so should work for all pages):

$w.onReady(function () {
$w(“#image2”).show();
});

export function image2_viewportEnter() {
$w(“#image2”).show();
}

export function image2_viewportLeave() {
$w(“#image2”).hide();
}

Is there some mistake in the code?
Here’s the link to my website page: https://muditchaudhary.wixsite.com/mysite-1/programme

Screenshots:
Before scrolling down.

522×889 131 KB

After scrolling down and scrolling back up. The logo doesn’t reappear.

466×891 78.8 KB

2

Hi Mudit,

Welcome to the Wix Code forums.

It seems to me that because after the image is hidden (when leaving the viewport) it doesn’t enter the viewport again. I am going to check this with QA since the logic on this seems incorrect. Even though the image is hidden, it in fact still enters the viewport - although it isn’t shown.

In any case, I have a work around. I connected the “hamburger” icon (menu) to viewport enter/leave and then the logo is shown/hidden as it should.


Here are the event handlers:

export function vectorImage1_viewportEnter(event, $w) {
	$w("#image2").show();
}

export function vectorImage1_viewportLeave(event, $w) {
	$w("#image2").hide(); 
}

I hope this helps.

Yisrael

3

Thank you very much. It works now.

4

I have a similar issue…want to hide this Stip on load and appear on viewPoint Enter
But it is hidden on load and doesn’t show on viewportEnter … this is the code I have used and please find attached the screenshot

export function Strip1_viewportEnter(event, $w) {
$w(“#Strip1”).show();
}

1067×546 199 KB

5

this is the site view https://saintagcc.wixsite.com/website-5

6

Are you experience this problem at published site? How about preview mode?

7

812×854 219 KB

I have this pattern on the top right corner of the page which I need to hide when page scrolls down,

Here the problem is, I don’t know how to identify the viewport, I tried all the code which was mentioned in most of the support posts.

Can someone please help me.

here the box id is image16 and that’s pinned the columnstrip2

8

This post is old and is being closed, please open up a new thread with your own issues/questions instead of bumping up old posts.

This is against the community guidelines.