GSdaBlessedFist

Oh, wow! Thank you for the fix and the explaination. It gave me insight into how to better rig my vector docs.

I'm attempting to make an SVG element draggable. But it doesn't seem to react to the click event. I've tried substituting another SVG element with the same result. The element I'm trying to catch is HTML line 99 : id="page1-panel-3-badge" I've also registered the Draggable: gsap.registerPlugin(Draggable); I'm using the following CDN's: https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/Draggable3.min.js (as provided on the site) and tried this one too: https://cdnjs.cloudflare.com/ajax/libs/gsap/3.10.4/Draggable.min.js Could I have someone take a look at why I can't control these SVG elements with Draggable, please. I run into this issue at line 86 in the JS: Draggable.create(badge, { //<--badge element in HTML line 99 bounds: document.querySelector("#page1"), onClick: function () { console.log("clicked"); }, onDrag: function () { if (this.hitTest("#page1-panel-2-bg")) { gsap.to(this.target, { duration: 0.6, opacity: 0 }); } } });

That is exactly what I needed. Thank you, very much.

Hello, I'm attempting to create an animation using stacked svg layers. The animation is 3 seconds long and was drawn at 16fps. There are 48 frames all together. There is one svg element and 48 layers within it. All layers start off autoAlpha: 0. I'm staggering their appearance but can't figure out how to work with frame timing and how to make them disappear. Can some one help please.