Jump to content
Search Community

_andrewireland

Members
  • Posts

    6
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

_andrewireland's Achievements

  1. Hi @ZachSaucier, that did fix the issue — thank you! And also thank you @mikel for bringing gsap.utils.distribute to my attention, I hadn't seen that yet. It seems like a very powerful feature.
  2. Hi, there! Previously ZachSaucier provided me with some fantastic insight into his approach to a looping animation problem I was trying to solve. Due to some visual/design requirements I've ended up trying to achieve this using a slightly different method. Rather than the tween approach he used, I'm trying to loop a section of a timeline a specified amount of times. Currently, I've tried doing this using the tweenFromTo method below. This works perfectly on the first scroll down and back up the page, but on subsequent scrolls the repeat no longer works. mainTlLoop .add(mainTl.tweenFromTo(0, "endLoop")) .add(mainTl.tweenFromTo("startLoop", "endLoop", {repeat:6})) Is there a property I can use to change this behaviour, or do I need to look into another method to succesfully do this? I'd prefer to use the existing timelines if possible. I noticed in the tweenFromTo docs it says; Is this part of the issue? Thanks for any guidance you can offer, Andrew
  3. Thanks for your help on this Zach, it's really eye opening to see your thoughts on the matter — calculating the repeats how you've shown seems like the way forward. Overall this is really clear, but I'm struggling to work out how these values are determined/what magic is going on here: wordTl.time(pageYOffset % 67 + 105); Also, I apologise my initial code wasn't particularly concise — for this animation I was experimenting with the idea of having slightly different timing for each '.text' element, so I needed the flexibility for each element to be animated differently. Thanks again, you've been super helpful!
  4. Hello everyone! I've been racking my brain trying to think of The Right Way™ to do this. In the codepen demo I've been working on, I've worked out how to have an inital timeline, which then moves to the main timeline. The total duration of the timeline is linked to the total pageHeight, and progress is tied to the scroll event. The main timeline currently repeats infinitely as this needs to continue to animate for an unspecificed amount of time (This could vary depending on the page's total scrollHeight). Ideally I would like to have another timeline play at the very end of the duration which resets the 'FOUNDER' text back to the initially displayed state just before the end of the total duration, but I'm pretty stumped on how I should approach this with GSAP given I don't have a fixed distance to scroll. Does anyone have any ideas or methods? Is there a better method I should be using rather than repeat -1 in this instance? Thank you for any help or suggestions in the right direction! Andrew
  5. Thank you so much for your help @ZachSaucier! That's a really elegant solution that makes a lot of sense (I can assure you I would have been banging my head against the wall for a very long time to figure it out though...) I'm excited to continue learning GSAP deeply. I've used it in the past here and there and have been incredibly impressed by it's performance, and the simplicity of syntax without hindering possibilities. Thanks again!
  6. Hi there! Previously, I have used ScrollMagic with GSAP for scroll based animations, but currently I'm trying to move forward without it! After searching through the forums, based on @OSUblake's original codepen, I was able to figure out a method I could use to do this using multiple timelines in a forEach loop. This seems to work well, but in testing on a real-world use case I'm noticing that if I reload the page with the scrollbar/pageYOffset not at the very top, the animation breaks. Has anyone run into this issue, and know how I can resolve or work around this? I'm noticing the issue in Chrome/Firefox, but not in Safari. I can't replicate the issue within the codepen window due to the way it executes the script, but if you export it from codepen and run it locally, you should be able to replicate the issue. Thanks for any help you can provide
×
×
  • Create New...