Jump to content
Search Community

AmbrosiaDevelopments

Members
  • Posts

    2
  • Joined

  • Last visited

AmbrosiaDevelopments's Achievements

  1. Thank you! I've stuck with the third option and just added a `delayedCall`. I'm amazed by how a solution is always just around the corner with GSAP and there's nothing much it can't do. You just have to know what keywords to use to search the documentation!
  2. Hello fellow tweeners! I've been trying to make a snow fall effect that loops and randomizes the cx attribute on the SVG element I'm using. I have 3 codepens to try and explain my issue if you wouldn't mind indulging me for a moment. I am confused as to what I am doing wrong in the first two instances and how they could be fixed to have the same effect as the third instance. Additionally what I am hoping to be able to add is an effect of the particle staying on the ground for a little time before the loop repeats, this way it looks like snow is hitting the ground, building up and then melting while more snow continues to fall. Could anyone advise how I could achieve this with any of the pens provided please? Thank you so much! I just started using this library yesterday and I love it! The first (xxyyKrM) is using a timeline with `progress()` and a repeating stagger. I'm attempting to use `repeatRefresh` to change the `x` value but because the repeat is in the stagger section it doesn't work. Because I'm not using an array of elements and a `forEach` loop I don't have access to the element that is being processed so I can't add an `onRepeat` function and pass in the element to it to have it set the values after each run. The effect is nice but it's not randomizing the positions on repeat and after a while becomes very noticeable. https://codepen.io/AmbrosiaDevelopments/pen/xxyyKrM The second attempt (JjmaqEx) I made is using a `forEach` loop and `gsap.to()` that has `onRepeat` which calls a function to randomize the `cx` value. This randomizing works now but upon first load, all snow is dumped at the same time, there is no stagger effect until each particle hits the ground, then it works fine. https://codepen.io/AmbrosiaDevelopments/pen/JjmaqEx In my third attempt (yLRRBqE) I stopped using `stagger` and `repeat` and instead used a `delay` with a `forEach()` loop. I use `onComplete` and call a function to randomize the position and then at the end of that call the function wrapper for the original `gsap.to()` call. Now I have the effect I want and it is randomizing the position each loop. Only drawback is that there is less snow in the frame at any one time compared to the other codepens.
×
×
  • Create New...