How to create a wiggle effect using GreenSock

1
votes

I can't see any built-in methods in TweenMax that lets you "wiggle" an object from side to side. It needs to be a really quick animation from its start position such as: x -> x-5 -> x+5 -> x-5 -> x+5 -> x.

4
actionscript-3flashtweengsap

4 Answers

1
votes

If Bounce isn't working for you, you will have to create the effect yourself by working with a counter and the onComplete method!

2
votes

Well i think you can use this, I found something similar but was for AS/Flash version so I had to make it JavaScript and it works for me, is simple:

var shakeTween = function(item, repeatCount){
var max = 5;
var min = -5;
TweenMax.to(item,0.1,{repeat:repeatCount-1, x:Math.floor(Math.random() * (max - min + 1) + min), delay:.1});
TweenMax.to(item,0.1,{y:0, x:0, delay:(repeatCount+1) * .1});
}

See the working example here

Where item is the HTML Element reference (you can use jquery or wharever) and repeatCount is how many times will play the wiggle animation.

-1
votes

Just in case you're using JQuery, you can do this: $('#YourElementID').effect("bounce", {times:3, distance : -5, direction : 'right'}, 300);