Slowchange

Thanks all! I think timeline.revert() will do the trick for my use case here, will keep in mind the approach of manually resetting properties one by one for future reference also. Cheers!

No problem, sorry, should've just done one in the first place. You'll see what I'm talking about in the demo below, hopefully. Trying to clearProps on a PIXI sprite doesn't work, presumably because the sprite is not a DOM element. Just wondering if there's an equivalent way to do this (clearProps/reset transforms) for the sprite. https://codepen.io/stuartmack/pen/jOvNMOM

Hey everyone! Can anyone tell me, is there a way to use clearProps or an equivalent to reset PixiJS sprite transforms/tweens (with or without PixiPlugin?) I'm wanting to reset some transforms on some sprites for a scene that can be exited and re-entered within my web app - as I understand it, clearProps is a CSSPlugin method/property, so not sure if it is valid or accessible through PixiPlugin. I'd rather not destroy the actual sprite instances themselves, just to do with the way I'm loading and managing my 'master' pool of sprites at app level. I tried a couple of approaches: gsap.set(sprite, {pixi: {clearProps: true}}) gsap.set(sprite, {clearProps: true}) and received this message both times Invalid property clearProps set to true Missing plugin? gsap.registerPlugin() Sorry for no CodePen, I didn't think this warranted one but can whip one up if it makes my question more answerable! Thanks

Possibly a weird tangent, but from some more playing around with things, I've noticed that all my unstable pins/triggers correct to desired, clean pinning behaviour when I change browser tab (or window) and then come back to the project's tab/window. This is without doing any workarounds with PIXI, and also is on the latest ScrollTrigger version (3.7.1) It might be ill-advised, but I was wondering if there's a way to fire this event on page load to simulate whatever this correction is coming from. Do you guys know what it is that ScrollTrigger might be doing here to 'refresh' things? I feel like whatever is happening that's fixing things is not the same as a regular ScrollTrigger.refresh(), as I've tried calling this (with and without 'true' argument) after the page loads and it doesn't seem to help in the way that leaving the tab/window does. Sorry if this is getting in the weeds too much ?

@GreenSock For what it's worth, that latest fix with the PIXI adjustments appears to have completely solved the problem for me on Chrome/macOS Catalina! Thanks so much for that (especially given that it was sort of a PIXI issue, thanks for digging into that aspect - above and beyond as usual). I guess I'll have to do some QA for other devices/OS to see if I can replicate (or avoid) the problem @OSUblake is seeing now. Thanks guys

Thanks for the followup, @GreenSock - unfortunately still getting that dragging/wobbling behaviour on that last pen. Had a busy day yesterday but I'll have a chance to try implementing the fix from your previous answer today. Let you know!

@GreenSock - amazing, thanks so much for the quick and well-explained answer! I'll have to go and have a look over my project again to remind myself why I went with the scroll wrapper instead of the window - I do know that at some point in the project, I decided maybe I didn't need it, refactored, and had other troubles - sorry, pretty vague, I know. I'll check out the viability of losing the scroll wrapper, and if that's a no go, your answer around pinType: 'fixed' and the related considerations seems very promising. Will report back if I get it sorted, in case anyone else has this problem at some point. Thanks again!

Here's a quick screen recording of the behaviour: wobble.mp4

Thanks @OSUblake. I'm using Chrome on macOs Catalina. The embedded demos work fine here for me, but the issue occurs on the full-screen version (of the second codepen in my post).

Hi all. I've been using and loving GSAP/ScrollTrigger for a little while but am new to the forums (well, I've spent plenty of time reading but first time posting). So I'll echo many other first time posters by saying a big thanks to the GreenSock team for all the GSAP magic and support you guys provide to the community here. Much appreciated. Anyway - my question is to do with pinning elements in ScrollTrigger. I've made a quick codepen recreating the issue I'm having, and really hoping someone can help me out. The site I'm working on is using Ajax for page/content transitions, and so my ScrollTrigger is set up where the inner container is the 'default' scroller, rather than the document body. The problem I'm having now, which you should be able to see in my codepen, is the pinned section of the page jumping/wobbling rather than being tightly pinned as it hits the trigger's 'start' position. On this particular page where I'm having the issue, I've got a canvas element being created by PIXI.js as the page loads. I thought at first that maybe this was causing the problem, as I seem to remember reading in the docs somewhere that changes to the DOM after ScrollTriggers have been created can throw them off. (Although the canvas element being created shouldn't be changing the layout at all, as it's contained within its larger section?) What I did realise, is that when I change the 'scroller' element back to the default, rather than my '.scroll-wrapper' - the problem is fixed, and the pinning works smoothly as expected. So I'm at a bit of a loss. Is this a problem with my '.scroll-wrapper'? I'm using that scroll-wrapper on other pages of the site and things are pinning smoothly. Here's a fork of my codepen that's NOT using my custom scroller/scroll-wrapper, to save you having to mess around with it, and the pinning working perfectly. https://codepen.io/stuartmack/full/yLXBLJb I've read that using 'anticipatePin' when pinning these large sections can help, but this doesn't seem to make any discernible difference for me here. Would massively appreciate any help on this one! Thanks! EDIT: If you're not seeing the wobbly behaviour on this bottom codepen, please try viewing it full-screen or refreshing it!