javascript - Preventing queues with JQuery effect() with fixed position elements -

the situation

i using effect() function of jquery ui. type of effect doesn't matter purpose of question lets use "bounce". effect called when link clicked, complete example code follows:

$('#button').click(function (e) {     e.preventdefault();     $('#box').effect('bounce'); }); 

here demo

---

the problem

the problem have, or more behavior want rid of, when click link multiple times in quick succession queues animations. (see demo, click link 10 times fast, release , watch continue animate)

---

the requirement

i want prevent effects/animations being queued. in other words, looking clicks ignored if box bouncing. there anyway can this?

---

the failed attempts

i have done research, , tried couple of method below no success:

$('#box').stop().effect('bounce'); 

stop() doesn't seem have effect in case.

$('#box').clearqueue().effect('bounce'); 

clearqueue works in sense effects don't queue, there side-effects causes layout mess up. assume because prevents effect returning styles defaults. may related using fixed position box.

this should trick.

$('#button').click(function (e) { e.preventdefault(); if( !$('#box').is(':animated') ){      $('#box').effect('bounce'); } });