[TweenMax + css calc() function as param value.]

 

Hi SakalaWeb 

 

You wouldn't need to use CSS calc() in your JavaScript. I think innerHeight and innerWidth would help with your calculations. So something like this:

var h = window.innerHeight;
var w = window.innerWidth;

That will give you the window dimensions. From there you can calculate the center by dividing each by two and then position your box in the center. (or as close to center as you want it).

 

More info:

https://developer.mozilla.org/en-US/docs/Web/API/Window/innerHeight

https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth

 

Hopefully that helps.

 

Happy tweening.

 

 

Ok it's working but what when I need to do that calculations in some responsive container. Do I need to refer to parent element.rect -> do calcs -> pass vars to tween? Is css calc() function problematic?

[TweenMax + css calc() function as param value.]

Hi I have problem when animating with CSS calc(). It's just jump to new position, without delay and animation. Is there any special way to do css math when tweening?  How to make tween relative to viewport or container?

See the Pen KWbQxN?editors=0011 by sakalaweb (@sakalaweb) on CodePen

[BezierPlugin path problem]

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