No translate3d ?

[RenanSantos 3 Likes (Newbie)]

Can't i use translate3d in my tweens?

I see x and y for translate, but no translate3d!

[GreenSock 18,894 Likes (Superhero)]

Sure, just use z. 

 

TweenLite.to(element, 1, {x:100, y:20, z:300});
 

[RenanSantos 3 Likes (Newbie)]

But x and y will be a 2d translate and not the same as translateX and translateY.

[GreenSock 18,894 Likes (Superhero)]

What do you think is different exactly?

[RenanSantos 3 Likes (Newbie)]

Isn't that right that translate3d triggers hardware acceleration?

So it would be better to use it when it's available...

[RenanSantos 3 Likes (Newbie)]

Using z: 0.1 generates a matrix3d, so, i think it's ok!

[GreenSock 18,894 Likes (Superhero)]

Yep, and for the record, translate3d() is no different (as far as I know) than adding a translateZ() in terms of triggering hardware acceleration. The whole idea is to just have a non-zero z. It's just that translate3d() is a shorter way than typing out translateX() translateY() translateZ() 

[agamemnus 1 Likes (Newbie)]

Ok.

I am using: "{x: 0, y: 0, z: .001}" to replace "translate3d(0, 0, 0)"... is there a way I can trigger this without using a low z value?

[jamiejefferson 1,200 Likes (Superhero)]

Yes in GSAP there is a force3D property you can add to a tween that tells the object to apply this tweak. It only needs to be added to an object once and GSAP will remember it for future tweens.

TweenLite.to(foo, 1, { x:100, force3D:true });

[agamemnus 1 Likes (Newbie)]

Thanks.