Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
AslanGoi

Can't overwrite another tween properly

Recommended Posts

Hey!

 

I have the same divs with classes called "wrapper" and they both have same elements called "box" inside.

When you mouseenter "wrapper" all boxes inside getting filter:grayscale(1) and autoAlpha:0.5 by tween,

but also I have another tween which is saying that box that you target must be filter:grayscale(0) and autoAlpha:1.

 

So my problem is that I can't overwrite first tween by second properly, if I add overwrite:true inside tween2 my function will not work at all.

 

What am I doing wrong? Can you help me, please?

See the Pen ExgaELL by ChicagoJostik (@ChicagoJostik) on CodePen

Link to post
Share on other sites

I found out that it is better to not use reverse(), instead of this I made another codepen,

but I still have issue, when you mouseenter first box will not change, but other will work normally:

See the Pen ZEpYRJE by ChicagoJostik (@ChicagoJostik) on CodePen

 

I still need help)

Link to post
Share on other sites

 

Hey @AslanGoi

 

Usually it is best to create tweens beforehand and only change their play-state on events, like you tried to do in your first pen there.

 

In situations like this one, it can become tricky though, when multiple pre-stored tweens are supposed to tween on the same elements and vars on different events that may occur at the same time.

 

So I often tend to work with classes instead. This might not be the most proper solution, but it works.

 

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

 

  • Like 1
Link to post
Share on other sites

 

Sorry, I am targetting all boxes in the pen above, instead only the ones in the respective wrapper, like here

 

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

  • Like 2
  • Thanks 1
Link to post
Share on other sites

@akapowl Thanks a lot!

I tried to add these classes and target them, but didn't go in a right direction.

Link to post
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.

×