Jquery finish on mouseout multiple events

Jquery finish on mouseout multiple events

Okay so I am trying to make multiple animations happen, onmouseenter i
have a bounce effect that uses finish(); on mouseout and onclick moves
position problem is, if you click and and then move your mouse out of the
div it finishes the click animation, i have tried using variables, .data
and other various methods but have failed miserably and am looking for a
quick solution.
Here is the jsfiddle: http://jsfiddle.net/fMxfp/13/
Here is the code
$.fx.speeds._default = 1000;
$.fn.StartBounce = function() {
var self = this;
(function runEffect() {
self.effect('bounce', {distance:20}, 5000, runEffect);
}) ();
return this;
};
$('.iconeffect').mouseenter(function() {
$(this).stop().StartBounce();
});
$('.iconeffect').mouseout(function() {
$(this).finish();
})
$('#effect1').click(function() {
if( $("#desc1").is(":hidden") ) {
bounced = false;
$(this).finish();
$(this).stop(true, true).animate({ left: -50});
$('#effect2, #effect3').stop(true, true).animate({ left: 1000});
$('#desc1').show( "blind", 1000);
} else {
$(this).finish();
$(this).stop(true, true).animate({ left: 0});
$('#effect2, #effect3').stop(true, true).animate({ left: 0});
$('#desc1').hide( "blind", 1000);
}
});