0

Probably very simple, but not sure why isn't working on my side. I have a toggle button for a menu, I want to prevent Y scrolling when the button is clicked. I have the following:

$('.canvas-off-toggle').click(function(e) {
    e.preventDefault();
    $('.a-class').toggleClass('is-active');
    $('.another-class').toggleClass('is-active');
    document.body.style.overflowY = "hidden";
 });

It adds the class but it doesn't seem to add it to the body and I can keep scrolling on "Y" axis. Help please?

John R
  • 247
  • 1
  • 4
  • 15
  • it works for me here https://jsfiddle.net/o2gxgz9r/11615/ – Paul Fitzgerald Aug 09 '17 at 21:19
  • I can still scroll on the "Y" axis too in that fiddle either Safari or Chrome – John R Aug 09 '17 at 21:22
  • Sorry dude, You can't do that: https://stackoverflow.com/questions/6421966/css-overflow-x-visible-and-overflow-y-hidden-causing-scrollbar-issue Check this answer: https://stackoverflow.com/a/17432665/1736186 – instead Aug 09 '17 at 21:25
  • @JohnR I must be misunderstanding but if you click on the box it will prevent any scrolling on the y axis (note you must click on the box first) - https://jsfiddle.net/o2gxgz9r/11618/ – Paul Fitzgerald Aug 09 '17 at 21:27
  • Possible duplicate of [CSS overflow-x: visible; and overflow-y: hidden; causing scrollbar issue](https://stackoverflow.com/questions/6421966/css-overflow-x-visible-and-overflow-y-hidden-causing-scrollbar-issue) – jhpratt Aug 09 '17 at 22:02

0 Answers0