How can I lock scrolling?

Ask the community
,
1

So I want to disable scrolling (up and down) temporarily on my page.
For example, when a visitor enters my page, he can’t go up or down for 10 seconds.
Thanks in advance.

2

You can try something like:

import wixWindow from 'wix-window';
let lockTimeInSeconds = 10;
let stratTime = new Date().getTime();

$w.onReady( function () {
  let runLock = setInterval(()=> lockPosition(), 100);
  function lockPosition(){
    wixWindow.scrollTo(0,0);
   let currentTime = new Date().getTime();
   if(currentTime -  stratTime >= lockTimeInSeconds * 1000){
   clearInterval(runLock);}
  }
})
3

and of course, if you want to lock to another position, change the wixWindow.scrollTo(0,0) to your desired position.

4

@jonatandor35 It works! Thank you for your answer.

5

@jonatandor35 Also, what do I need to do to make the code only run for desktop visitors?

6

@b4443569 , to do it for desktop only :

import wixWindow from 'wix-window';
let lockTimeInSeconds = 10;
let stratTime = new Date().getTime();

$w.onReady( function () {
if(wixWindow.formFactor === "Desktop"){
  let runLock = setInterval(()=> lockPosition(), 100);
  function lockPosition(){
    wixWindow.scrollTo(0,0);
   let currentTime = new Date().getTime();
   if(currentTime -  stratTime >= lockTimeInSeconds * 1000){
   clearInterval(runLock);}
  }
  }
})

For tablets + desktop but not cellphone -
instead of:
if(wixWindow.formFactor === “Desktop”)
Use:

if(wixWindow.formFactor !== "Mobile")
7

@jonatandor35 Thank you.

8

@b4443569 You’re welcome

9

I want to lock the scroll so people has to click on a floating button to automatically scroll all the way down to the anchor I set. An then in this second section show the header bar. Can someone help me with that? please

10

There’re 2 ways to do it (if you have a premium account).

  1. The straight forward is to use a custom element, disable the scrolling and resume the scrolling via setAttriubute()

  2. An alternative workaround will be to use the code above. And put the clearInterval() inside an onClick handler.

11

@jonatandor35 is there any way to disable scrolling only for my homepage? I want to keep it enabled for other pages.