How to get YOffset

Ask the community
,
1

So I’m trying to follow this video here:

and try to make my header similar to this. I want it to shrink when it scrolls to a certain point of the page. However, window.pageYOffset is not allowed because window is not defined. How else can I approach this?

2

Also are scroll effects a thing on Wix yet ?

3

Hi,

at the moment there is no way to make it animated. But you can have two headers one large and one smaller. You could switch which one is visible based on what is visible in the site.

Say, you wanted to switch headers when a title image is no longer visible (you scrolled past it), you could do something like this:

$w('#titleImage').onViewportLeave(() => {
    $('#bigMenu').hide();
    $('#smallMenu').show();
});

$w('#titleImage').onViewportEnter(() => {
    $('#bigMenu').show();
    $('#smallMenu').hide();
});

I hope this helps. Have fun Wix Coding!