Disable scrolling until button pressed

Discussion Ask a question
,
1

How to do this?

Thanks everyone in advance!

2

In my experience you have 2 options to access this:

  1. Collaps all items so there is nowhere to scroll, and when you click Cancel collaps
  2. Scroll to the top of the page whenever the user tries to scroll down (you can use view port enter) and cancel the action when you click the button.
3

Thanks a lot!

4

I’d like to see how that looks in practice. If the results are functionally identical it doesn’t much matter, but I suspect it isn’t the best way. I’m almost positive you can use standard web APIs to do this. Either inject code using Tracking & Analytics or if you’re lucky enough to have it enabled on your account, there’s a decent chance you can achieve this with Custom Element.

5

@lee1 Yes. Everything can be made, but at what performance cost?

I will update you.

6

@lee1 I chose to use this:

export function top_viewportLeave(event) {
$w("#top").scrollTo()
}

so #top is simply an anchor on the top of the page. (It will gently scroll you up, if you want to scroll down. Nothing too clunky. Also scrolling with the visible scroll on the right hand side, wont work. So for me 10+ solution.

For my case, I will need a boolean to ask if button has “released” the lock. And maybe some text advising user.

Thanks for you time Lee.

7

@allu112apina alternatively you can use setInterval() with 100ms to scroll to position 0,0, and clearInterval() once the button has been clicked.

8

@jonatandor35 Can you show some code on how that would be done?

I was unable to create notclunky-if condition that works well.

ICame up with this very hacky way:

export function text70_viewportEnter(event) {
$w("#top").scrollTo()
}

And when button pressed:

$w('#text70').hide();

Works as I would need it.

If anybody has better idea, feel free to tell me.

Thanks for everyones time.

9

@allu112apina , try soemthing like:

import wixWindow from 'wix-window';
$w.onReady(() => {
    let fixPosition = setInterval(scrollup, 100);
    function scrollup(){
        wixWindow.scrollTo(0, 0, {scrollAnimation: false});
    }
    $w('#button1').onClick(event => {
        clearInterval(fixPosition);
    })
})