Jump to content
GreenSock

Sukru

Menu scroll pause

Recommended Posts

Hello, first of all, the problem is;

I am making a project with gsap. I want parallax to work on desktop version and I have succeeded.

When the menu opens, I wanted to pause the body scroll, which works successfully.

But there was a problem. I can't pause sroll in mobile version because the project is not loaded in GSAP (768px) resolution. I want to pause body scroll in both mobile and desktop versions.

 

I am sharing the code and codepen link with you.
Can you help me?

 

console.clear();
gsap.registerPlugin(ScrollTrigger, ScrollSmoother);

let smoother;
const mm = gsap.matchMedia();

mm.add("(min-width: 768px)", () => {
  smoother = ScrollSmoother.create({
    wrapper: "#smooth-wrapper",
    content: "#smooth-content",
    smooth: 1,
    normalizeScroll: true,
    ignoreMobileResize: true,
    effects: true,
  });
  return () => smoother.kill();
});

 

See the Pen MWGVNjK by sukruemanet (@sukruemanet) on CodePen

Link to comment
Share on other sites

12 minutes ago, GreenSock said:

How about this? 

 

 

 

Yes the problem is solved @GreenSock thank you very much :) 

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×