JQuery shaking effect with some tilt/rotation
<p>I am trying to create an effect where on button click, the div would shake left and right and tilt about 10deg each way so it looks like a natural motion when shaking an object with two hands. I am able to create the left and right shaking effect but can't seem to tie it in with rotation. I also need this to work in IE8, so css3 is not an option. I am using JQuery UI and .rotate() but if there is a better way please let me know. I need this to shake about 3-4 times on button click.</p>

<pre><code>    &lt;div class="container"&gt;
&lt;div class="globe-main" id="globe"&gt;
    &lt;div class="content"&gt;&lt;/div&gt;&lt;!-- end .content --&gt;
&lt;/div&gt;&lt;!-- end .globe-main --&gt;
    &lt;/div&gt;&lt;!-- end .container --&gt;

    &lt;script&gt;

var times = 4;
var loop = setInterval(rota, 300);

function rota() {
    times--;
    if(times === 0){clearInterval(loop);}
    $(".globe-main").rotate({animateTo:10, duration: 500, });
    //$(".globe-main").effect("shake", { times:3, distance:30 }, 800);

}
rota(); 

    &lt;/script&gt;
</code></pre>

<p>Here is what I have so far <a href="http://jsfiddle.net/J2ySt/" rel="nofollow">FIDDLE</a> </p>

<p>Thank you</p>

<p>UPDATE</p>

<p>Here is the updated <a href="http://jsfiddle.net/J2ySt/2/" rel="nofollow">FIDDLE</a></p>
