Jump to content
Search Community

Horizontal scroll animation width "containerAnimation: scrollTween"

KenSaki test
Moderator Tag

Go to solution Solved by GreenSock,

Recommended Posts

Hello everyone,

 This is my first post from Japan.

 

I need your help to add animation within horizontal scroll container.

In this case, I'd like to add animation on a box whose number is 4, giving it "class='test' ".

I tried it, but it didn't work.

 

my problem is containerAnimation is not working.

Developer tools says "caught ReferenceError: scrollTween is not defined".

I know a meaning of the error, but I can't get it because I use latest version of gsap and scrollTrigger which is 3.11.5 and checked officila gsap codepen many times.

 

I'd be very happy if you teach me.

See the Pen PoyNBYW by banananan (@banananan) on CodePen

Link to comment
Share on other sites

  • Solution

I assume you wanted to do this?: 

See the Pen bGmpxqJ?editors=0110 by GreenSock (@GreenSock) on CodePen

  1. There's no need to create a timeline when you're only putting one tween into it. 
  2. You forgot to save the container animation (tween) as a variable and pass that as the containerAnimation
  3. You must use ease: "none" on your container animation to ensure positioning is mapped linearly

I hope that helps!

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