Jump to content


Scrolling window in increments

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi guys, first off sorry for the lack of codepen - I thought it such a simplistic question that it didn't necessitate one. My question is with the scrollTo plugin are we able to scroll in increments? So on each click of a button scroll the window by 100 each time? I thought you may be able to do += but that doesn't seem to work. Here's a site for reference (click the arrows either side of the body). http://resn.co.nz/#!/work/climachill


If need be I will set up a codepen. Thanks as always guys. 

Link to comment
Share on other sites

Hi ochalmers  :)


You could do that with a variable. Set your variable equal to 100 (or whatever your increment will be) and then scroll the window to that point.

TweenLite.to(window, 2, {scrollTo:{y:yourVariable}});

You can then add/subtract 100 from your variable as part of your click function. That should work for you.


Hopefully that helps.


Happy tweening.


  • Like 3
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.