Jump to content
Search Community

Does ScrollTrigger work in a small wrapper?

shunyadezain test
Moderator Tag

Recommended Posts

Hi everyone,


I want to use ScrollTrigger to trigger some elements when the red box reach to the top of screen (or the top of the wrapper ). But the marker(start) doesn't move if you scroll in the wrapper.

Is there a way to trigger animation in the wrapper?


The box is just for the demo and I want it back to the original shape when the red box pass the end point.


Thank you.

See the Pen OJRREOJ by shunyadezain (@shunyadezain) on CodePen

Link to comment
Share on other sites

If you need to apply a ScrollTrigger based on an element other than the body you just need to specify the scroller in the ScrollTrigger:

scroller: ".wrapper",

If you want it to be relative to the viewport and you have it within another element with a scroller you'll have to manually offset the start position by calculating how much if should be offset by and adding that in.

  • Like 1
  • Thanks 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...