Easing without Move Back

[dizain]

Hello,
I do not know how to perform the animation of move right without route back.

Anybody help?

https://jsfiddle.net/y4L3xr3t/1/

 

[Carl]

Thanks for the demo.

It would really help if you could explain how we should interact with it and what the desired result is.

 

I added some logs to your conditions and it seems that due to the way the logic and conditional statements are set up that multiple statements are true which then creates competing tweens at the same time.

 

if ( StopX < window.innerWidth  / 2  ) {
  console.log("conditionA")
    TweenLite.to(this.target, 1, {x: 0,y: 0})
} else {
console.log("conditionB")
TweenLite.to(this.target, 2, {x: 100 + "%" })
}


if ( StopX > -window.innerWidth  / 2  ) {
console.log("conditionC")
    TweenLite.to(this.target, 1, {x: 0,y: 0})
} else {
console.log("conditionD")
TweenLite.to(this.target, 1, {x: -100 + "%" })

          

Open the console to see that multiple logs happen when you drag the green box and release: https://jsfiddle.net/4nm5qjmr/

[dizain]

Many thanks Carl, You have given me a hint, how to solve it.

https://jsfiddle.net/4nm5qjmr/1/