[attrPlugin to tween attribute="x y z"]

Hello again,

 

Thanks this is nice but for sure that was just testing about tweens its not gonna be my organization of tweens or performances will go deep down ;D.

 

Thanks for these interesting advices, and congratulations for this forum quite nice to read !

[attrPlugin to tween attribute="x y z"]

So, lets think that i wanna launch all this tweens at the same starting point but with different duration and mixing attr and threejs functions like : 

 

See the Pen LbBNXz?editors=1010 by onim4ru (@onim4ru) on CodePen

 

My problem here is to launch at the same time. It is used to generate tweens depending of what my users wants.

So i will prefere something like tweenmax.to (elem,duration, attr1 attr2 attrx ...)

or

simultaneous starting tweens like :

tweenmax.to(elem1,duration, property1)

tweenmax.to(elem2,duration, property2)

tweenmax.to(elemX,duration, propertyX)

....

 

Thank you for your ideas

[attrPlugin to tween attribute="x y z"]

That was just to have a generic way of developping my animations. But it is luxurious to already have a solution ! =)

[attrPlugin to tween attribute="x y z"]

Hi !

Thanks for your fast advices.

 

On the codepen you could see 3 ways : 

- modifying pos directly but you dont have animations

- try to use attr attribute for a position (doesnt work)

- modifying 3d object

 

The way 3 is the animation i want but i want to use the attr attribute, is it possible ? 

 

See the Pen woXygR?editors=1010 by onim4ru (@onim4ru) on CodePen

I would like to make like my goUp() function but i wanna this acting like goRight().

[attrPlugin to tween attribute="x y z"]

Hi !

 

I'm playing right now with Aframe position attribute on 3d object and with tweenmax.

The way you advices with the :

el.setAttribute('position', {x: 1, y: 2, z: 3}) 

Works well but is it possible to use the attr attribute from greensock ?

 

 

This one doesnt works ....

TweenMax.fromTo(element, 5000), { attr:{position:{x: 1, y: 1, z: 1}} }, 
 { attr:{position: {x: 5, y: 5, z: 5}}, 

   delay: 4000, 
   ease: Strong.easeOut
 }))

This way works but in a blink of an eye the value switch to 1 -> 5 so you dont have animation, just replacing values

 

TweenMax.to(element, 5000, 
                                    { attr:{position:"30 30 30"}, ease: Strong.easeOut, delay: 4000
                                    })

Do you have an idea please?