Jump to content
GreenSock

tahirw

is there an event for indicating when the yoyo is going backward or forward?

Go to solution Solved by akapowl,

Recommended Posts

I want to manipulate my img when its going backward/forward for example like this, is this possible?

if(yoyo is moving forward){
	img.addClass('bg-green')
}else{
	img.addClass('bg-red')
}

 

my current code is like this:

  const tween = gsap.timeline()
  tween.to(
    "#cart1",
    {
      duration: 5,
      ease: "linear",
      motionPath: {
        path: "#cart_path",
        align: "#cart_path",
        autoRotate: true,
        alignOrigin: [0.5, 1],
      },
      repeat: -1,
      yoyo: true,
    },
    "start"
  )

Thanks in advance :)

Link to comment
Share on other sites

  • Solution

Welcome to the forum @tahirw

 

I'm not sure if there is a dedicated method for that, but what you could do is use the .iteration() to determine wether the yoyo is moving 'forwards' or 'backwards'.

 

// e.g. in an onRepeat callback

onRepeat: function() {
  if (this.iteration() % 2 === 0) {
    console.log('yoyo is moving backwards')
  } else {
    console.log('yoyo is moving forwards')
  }
}

 

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

  • Like 1
  • Thanks 1
Link to comment
Share on other sites

Thank you so much its working :D

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