Empilez les valeurs "transformer: translateY" dans GreenSock?

Question

Je suis juste tombé sur ce merveilleux produit et j'ai réalisé que c'était exactement ce dont j'avais besoin! J'ai une énorme image qui est x fois la taille de la fenêtre, donc je veux faire défiler tout en bas sur le bouton. Je le ferais avec CSS comme ceci:

@keyframes { 
    to { 
     transform: translateY(-100%) translateY(100vh); 
    } 
} 

Ce avéré être un moyen crossbrowser en CSS au lieu de:

transform: translateY(calc(-100% + 100vh)); 

Est-il possible de le faire avec TweenMax? Je comprends que je peux calculer ces valeurs en pixels et les spécifier explicitement:

var value = -$('img').height() + $(window).height(); 
var tweenDown = TweenMax.to("img", 5, {y: value}); 

Cependant l'avantage de la façon « empilés » est que lorsque vous redimensionnez la fenêtre, il garde l'image dans la même position.

Merci d'avance!

Answer 1

C'est ce que je suis venu avec pour ceux qui se demandent:

TweenMax.to('img', 5, { 
    transform: 'translate3d(0,100vh,0)', 
    percentY: -100 
});