Jump to content
Search Community

Jacklifear

Members
  • Posts

    4
  • Joined

  • Last visited

Jacklifear's Achievements

1

Reputation

  1. Hello. This is a basic question regarding my StaggerTo animations. For scope of this, I'm using 2.x still and am using StaggerTo to animate a hand of cards and all of them work beautifully when adding new references to the array. When adding a reference/element to the middle of any stagger or removing an element from an array, I get some experiences I didn't expect. Delete from the array: It doesn't animate out or in reverse as I expected, it just "pops" out of existence. Example: https://gyazo.com/a6cb14ef2b75f9dd40eaf4393581db93 Add to middle of an array: The index and all items after the index are removed, and then they are animated in afterwards. Example: https://gyazo.com/d8e710656e77aeab1ad67110325b871d After research I'm not able to find out if there's a way to work a different stagger, or a setting that can be flipped to enable animations when an item is removed from the array. Or is it this way by design? I looked into make a codepen example, but I lack the skill to recreate the React Hooks + GSAP in codepen in any semblance of a reasonable timeframe, figured with this question it could be a quick answer before I potentially tried to do a lot of work for something that could be as simple as "not by design!". If anyone is kind enough to read and respond to this, I would greatly appreciate it.
  2. Thank you for the clear reply, Rodrigo. Time to pull these sleeves up and refactor all of the code
  3. Hello, In the learning process of React + GSAP and I've run into a situation where I can't find the easy solution. Should be a quick answer In previous projects, (javascript + html for example) I would write up a timeline, then set an array of elements with a { clearProps: "all" } to essentially reset it The code I'm working with now is React with inline styles. It seems that clearing the props in the same fashion removes all of the inline styles, and since it's not set in a css sheet, the animation doesn't reset but breaks and it seems this is working as intended. Is there a recommended way to approach resetting inline styles in react? Or should I start pushing to refactor all of the code into css files? Thanks for any of your time!
×
×
  • Create New...