Jump to content
Search Community

smooth page scroll

Houwer test
Moderator Tag

Recommended Posts

Thank you.
That was really fast.

 

Actually I don't get it.
With “smooth scrolling” I don’t mean smoothly scrolling to an element, but rather a smoothly animated kind of scrolling behavior in the page when the user scroll.
 

Edited by Houwer
  • Like 1
Link to comment
Share on other sites

3 hours ago, Houwer said:

With “smooth scrolling” I don’t mean smoothly scrolling to an element, but rather a smoothly animated kind of scrolling behavior in the page when the user scroll.

That's what the demos in the documentation page that Jacked linked to are doing. Can you please try to explain what's not like what you're wanting?

  • Like 3
Link to comment
Share on other sites

7 minutes ago, nonsense27 said:

mine is saying "Scrollbar is not defined" in this line:
const bodyScrollBar = Scrollbar.init(document.body

Hey nonsense27 and welcome to the GreenSock forums. It sounds like you're not properly loading the smooth scrolling library. Do that and the error should go away.

  • Like 1
Link to comment
Share on other sites

sorry but is "smooth scrolling library" different from ScrollTrigger? because i only imported these scripts:

<script src="./node_modules/gsap/dist/gsap.min.js"></script>

<script src="./node_modules/gsap/dist/ScrollTrigger.min.js"></script>

 

am i doing it right?

Link to comment
Share on other sites

3 minutes ago, nonsense27 said:

is "smooth scrolling library" different from ScrollTrigger? because i only imported these scripts:

<script src="./node_modules/gsap/dist/gsap.min.js"></script>

<script src="./node_modules/gsap/dist/ScrollTrigger.min.js"></script>

Yes, it is different from ScrollTrigger. Going off your code, it looks like you're basing things on this demo? Which means you need to also load smooth-scrollbar. You could use the CDN link in that demo if you'd like: https://unpkg.com/smooth-scrollbar@latest/dist/smooth-scrollbar.js Make sure to load it before your custom JS.

 

ScrollTrigger works with various smooth scrolling libraries, as the demos in the docs show.

  • Thanks 1
Link to comment
Share on other sites

3 minutes ago, nonsense27 said:

it seems that the scrolltrigger script i imported in the node_modules doesn't work properly. I tried using scrolltrigger cdn, and now it's working.

Hm, did you get errors or something? I wonder if you just forgot to gsap.registerPlugin(ScrollTrigger). You should absolutely be able to use ScrollTrigger in an NPM environment. 

  • Like 1
Link to comment
Share on other sites

3 minutes ago, nonsense27 said:

Uncaught TypeError: ScrollTrigger.scrollerProxy is not a function

 

That means you're not using 3.4.0 or later. Please update. scrollerProxy() is a brand new addition. 

 

4 minutes ago, nonsense27 said:

where should i put the gsap.register()?
i put it on my main.js, at the very first line.. am i doing it wrong?

As long as you run it when the window/documentElement/body are defined, you're fine. Obviously it should be before you create your tweens/ScrollTriggers. There's not a specific place you're required to do it, though. 

  • 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.
×
×
  • Create New...