Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

invisibled

Members
  • Content Count

    2
  • Joined

  • Last visited

Community Reputation

1 Newbie

About invisibled

  • Rank
    Newbie
  1. wow, thank you so much. This information is EXACTLY what i needed. And I swear I was googling and experimenting all yesterday. You've really helped me understand the process and i've implimented it successfully into my project. THANKS!
  2. I'm using TimelineMax to build a timeline of tweens as you scroll down the page. So far it's pretty basic, My page scroll listens to this function: onScroll = ({ offset, limit }) => { const scrollPercentage = offset.y / ( limit.y - window.innerHeight ) this.tl.progress(scrollPercentage) } And i am defining my tweens like so: for (var i = 0; i < container.children.length; i++) { const article = container.children[i] const [ title ] = article.children this.tl.to( title, 100, { transform : 'translate3d(15vw,0,0)' }) } What I want is for each tween's duration to be exactly the window height. Each article is 100vh so as soon as the article enters the viewport is the start of the tween, and as soon as it leaves the viewport is the end of the tween. I have the duration set to 100 just to play around with it, but it doesn't seem to effect the tween. Can anybody point me in the right direction here?
×