Jump to content
GreenSock

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

Deka87

Members
  • Posts

    4
  • Joined

  • Last visited

Deka87's Achievements

Newbie

Newbie (1/14)

3

Reputation

  1. A follow up question. Could changing both values simultaneously (translate pixels and percents) possibly affect animation smoothness comparing to animating only one value (pixels or percents)? I didn't see much difference when I tried, so just in theory? Thanks in advance!
  2. Sorry, I had to add that I got rid of the scrollbars in favor of overflow: hidden; on the parent container, that's why I am moving the image (with additional content) with transforms. I will include a codepen next time!
  3. Thanks for your answer! Although the className solution seemed to be the case, it was also very slow and laggy. While the following solution did the trick: tweenY = TweenMax.to(wrapperY, 5, { transform: "translate3d(0,100vh,0)", yPercent: -100 }); Thanks!
  4. Hi, I just came across this wonderful product and realized this is exactly what I need! I have a huge image that is x times the window size, so I want to scroll to the very bottom of it on button click. I would do so with CSS like this: @keyframes { to { transform: translateY(-100%) translateY(100vh); } } This proved to be a crossbrowser way in CSS instead of: transform: translateY(calc(-100% + 100vh)) .Is there any way to do so with TweenMax? I do understand that I can calculate these values in pixels and specify them explicitly: var value = -$('img').height() + $(window).height(); var tweenDown = TweenMax.to("img", 5, {y: value}); However the advantage of the "stacked" way is that when you resize the window, it keeps the image in the same position. Thanks in advance!
×