Jump to content
GreenSock

Mukhriddin

how can I give opacity to the item behind

Go to solution Solved by Cassie,

Recommended Posts

Hi guys. I need your help!

Thing I was expecting here is that when the second page is coming up, the first one's opacity needs to dicrease; and the third comes up, the second one's opacity reduces; and this progress goes on untill the last card (Done!).

And also if you take a look, this last card finishes items' sticky position. I mean when scroll reaches to the most end, the last cars brings the whole wrapper above. I wanted it stays as before ones. 

If you don't get me properly, let me know I will explain in details.

See the Pen bGLLOOY by Mukher (@Mukher) on CodePen

Link to comment
Share on other sites

  • Solution

Hey there!

 

You can access the previous panel in that loop like so.

Hope this helps give you a little nudge in the right direction. Good luck!
 

panels.forEach((panel, index) => {
 
 tl.to(panels[index - 1], {
  opacity: 0,
 })

})

 

  • Like 4
Link to comment
Share on other sites

44 minutes ago, Cassie said:

Hey there!

 

You can access the previous panel in that loop like so.

Hope this helps give you a little nudge in the right direction. Good luck!
 

panels.forEach((panel, index) => {
 
 tl.to(panels[index - 1], {
  opacity: 0,
 })

})

 

Thanks, Cassie!

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