[drag along path / non rectangular bounds]

That. Is. Perfect.

 

Thanks!

[drag along path / non rectangular bounds]

In the one and a half years since this question was originally posed, has there been any movement in this direction? I think I can manage to fake something similar with the DrawSVGPlugin, but I'm not sure if it'll really get me where I need to go.

[Shake animation?]

I'm trying to figure out a simple way to shake an element with GSAP. The way that Animate.css handles it, is translating 10 pixels to the left, then, 20 pixels  to the right, and repeating. Makes sense. This can be replicated as-is with a rather redundant TimelineLite setup, but I was wondering if there was a cleaner GSAP approach, perhaps using yoyo and/or repeat and/or RoughEase?

 

Something like:

TweenMax.to(element, 0.1, {x:"+=20", yoyo:true, repeat:5});

really just moves the element to the right and then back to the origin. I'm looking for something that would move it to the right, back through the origin to the left, and then back to the origin. A bipolar motion, rather than a unipolar motion, if you want to think about it like that. Is there a simple, non-timeline solution?