Hide main scroll while fixed element is on with its own scroll

Design help General
1

I have a contact div that appears fixed on the page. It has its own scroll. I want to hide the main scroll while contact div is activated, and return it when its not.

How to?

Here is my site Read-Only: https://zenus-test.webflow.io/
(how to share your site Read-Only link)

2

Here is how you can do it:

Webflow.push(function() {
  $('#open').click(function(e) {
    e.preventDefault();
    $('body').css('overflow', 'hidden');
  });

  $('#close').click(function(e) {
    e.preventDefault();
    $('body').css('overflow', 'auto');
  }
}

#open and #close are the id’s of your links that open and close your modal

edit: this one is invalid, look further down :wink:

1 Like
3

It’s not working.

I’m putting it on Custom Code like this inside a script tag:

Webflow.push(function() {
  $('#contact-open').click(function(e) {
    e.preventDefault();
    $('body').css('overflow', 'hidden');
  });

  $('#contact-close').click(function(e) {
    e.preventDefault();
    $('body').css('overflow', 'auto');
  }
}

On the console I get this error:

Uncaught SyntaxError: missing ) after argument list

If I add it, then it says:

Webflow is not defined.

4

Ouch. I think I missed a thing here. Please try this

Webflow.push(function() {
  $('#open').click(function(e) {
    e.preventDefault();
    $('body').css('overflow', 'hidden');
  });

  $('#close').click(function(e) {
    e.preventDefault();
    $('body').css('overflow', 'auto');
  }));
}

edit: still invalid, look even further down.

1 Like
6

Still doesn’t works. I’m adding the the ID names on the settings for each div. What could be the problem?

7

I still get this error:

Uncaught SyntaxError: Unexpected token )

8

Dammit :smiley:

Webflow.push(function() {
  $('#open').click(function(e) {
    e.preventDefault();
    $('body').css('overflow', 'hidden');
  });

  $('#close').click(function(e) {
    e.preventDefault();
    $('body').css('overflow', 'auto');
  });
});

Sorry, cannot test it myself at the moment so please bear with me!

9

Now that worked! Thank you!

I understand that code, but the error were simply some typos ?

10

Yes! Need to work on my proper closures seeing power. Literally missed and then misplaced a closing bracket, ugh… so embarrassing!

1 Like