donny

Cheers both, I just went with the solution below as I wanted the two animations to be independent of each other, so just set the padding with some data attributes. https://codepen.io/MichaelHeyDonny/pen/BaZpzVo

Forgot to mention more recently, I've had success using Draggable and FLIP together for what I needed. Here's an example that includes a bit of my final solution: https://codepen.io/MichaelHeyDonny/pen/yLXVxbx The top left blue bars are the triggers. There's a few things missing in this example like how to handle empty parent containers etc but thought I would share. The FLIP plugin has certainly helped greatly in providing a solution to what this has replaced. So thanks GSAP as always!

Hi all, In the CodePen I've set up a basic toggle that opens and closes a div. As part of the animation, the padding also expands from 0px to 20px. The 20px is however currently hard coded. What's the best way to store the divs original padding and refer to this for future animations? As currently if for example the button is toggled before the animation completes, the padding would return for example 10px if it wasn't hard coded. I was wondering if gsap had any way to store such properties? Or just storing it in a data attribute on the div is a fine solution.

Oh of course, that works fine! Thanks Jack

Hi all, I'd like to disable certain behaviour while I'm using Draggable and autoScroll is in play. Has anyone got any suggestions for the best approach to do this?

Thanks for the feedback Jack, yes I threw that together pretty quick. I've worked a little more on it today, and will refine further soon and also look to integrate your approach. Note I think for now this demo requires a min width of 500px to work properly. https://codepen.io/MichaelHeyDonny/pen/MWpLLeb

Thank you both, yes I'm thinking the same, in regards to using a placeholder element.

Hi, as the Flip plugin can move things around the DOM, could it be used together with Draggable to make sorting items with variable heights easier? For example in the provided Codepen, I'd like to sort these two items with behaviour similar to: https://codepen.io/joelcoxokc/pen/mAyyQP Clearly it's not playing well together currently, but would it be possible?

Fantastic, thanks Jack. Yes that clears things up rather nicely

Thanks very much Jack, both the beta and .time(0) resolves the issue. At least in Google Chrome, I first viewed in Brave and the issue seems to persist.. I'm wondering if there's a different approach to what I'm aiming to achieve as you mentioned it's very uncommon. As well as applying random x and y, I also wish to apply a random duration on each repeat. Is there another approach to changing in onRepeat? As I would have thought updating the duration if an animation is repeating wouldn't have been too unusual?

Hi all, The animation flickers when updating the duration onRepeat. What am I missing here?

All works well thanks Carl, much appreciated.

Hi all, I'm animating both back and forward between 4 set values (0, 8, 16, 24). These values are part of the range 0-34. When I'm at value 24 and need to move forward, the animation needs to play to 34 then return to 0. Also when at 0 and need to move back, it would need to play back to 34, moving to value 24. What's the easiest approach to achieve this loop? I'd also like to know how to apply this in the AS3 framework please. Thanks!