Jump to content
GreenSock

john002

Vertical scroll for divs inside a container

Recommended Posts

Hello,When I scroll to the coffee container, I wanna scroll the inside container and after I finished scroll to each box,I continued to scroll down.

The current situation is that it scroll together.How to fix it?

See the Pen RwjeKdM?editors=0110 by john002 (@john002) on CodePen

Link to comment
Share on other sites

Hey, @john002 welcome to the forum.

 

Ideally all you need is add scrollTrigger only for coffee section and pin that section. Sections above and below will follow unless you wanna do something different for those sections.

Right Now you have scrollTrigger for all the sections I am not sure why? and inside scrollTrigger object you are actually targeting the box-container. 
I hope I understood your problem right. 

See the Pen KKyGWgp??editors=1010 by tripti1410 (@tripti1410) on CodePen

Link to comment
Share on other sites

Thanks for your help, I want to control the inside  scrolling by outside scrolling.Similar to scroll one by one.

 

The stepimage.thumb.png.66399de72282684d3dba9b242fd6424a.png

Link to comment
Share on other sites

It's hard for me to understand exactly what you're looking for, but maybe something like this(?): 

See the Pen BamqWdg by GreenSock (@GreenSock) on CodePen

 

🤷‍♂️

Link to comment
Share on other sites

the coffee container should  inside scroll.look at my step image

Link to comment
Share on other sites

3 hours ago, john002 said:

the coffee container should  inside scroll.

 

Like this?

 

See the Pen gOXBxpB by akapowl (@akapowl) on CodePen

  • Like 2
Link to comment
Share on other sites

Thanks for your help,it very close to the effect I wanted. but the coffee container scroll list can fixed  the position? it have some black space.image.thumb.png.a6bf3a5fad42f8838f53bcd85a7b4098.png

Link to comment
Share on other sites

That is the pin-spacing taking place.

 

If you don't want any pin-spacing to be visible, you can wrap all your content in a div and pin that wrapping div instead.

 

See the Pen mdqzMBa by akapowl (@akapowl) on CodePen

  • Like 4
Link to comment
Share on other sites

That's it work, I really appreciate your answers!!!!!!

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