BezierPlugin path problem

[SakalaWeb]

Hi I try to make marker jumping from button to button in navbar. But don't know why my bezier path acting weird.

What am I doing wrong? How to make it go to half distance between buttons and up, like in karaoke for example?

See the Pen dNpOeW?editors=0010 by sakalaweb (@sakalaweb) on CodePen.

[Carl]

Hi and welcome to the GreenSock forums,

 

Thanks for the providing the demo. I don't have a ton of time to try to debug all the code but I did try to log out the values you are tweening to and found a bit of an oddity.

 

  console.log("point 1 ", markerRect.left, markerRect.top );
  console.log("point 2 ", (btnRect.left - markerRect.left)/2, markerRect.top-20 );
  console.log("point 3 ", btnRect.left+4, markerRect.top-10 );

 

Press on button4 and then go back to button1

 

"click"

"tweenMarker()"

"point 1 " 1352 47

"point 2 " -649.609375 27

"point 3 " 56.78125 37

"tweenMarker() End"

 

I don't think you want the x value on point 2 to be -649.

 

You can see my version here: https://codepen.io/GreenSock/pen/qRavyo?editors=0011