Question

I don’t know how to disable the queue when I’m not using .animate() . I think .clearQueue() would work maybe, but I don’t know where to put it. Thanks!!

$('.one').hover(
  function () {
    $(this).addClass('bigger-outer', 1000);
    $(this).find('.inner').addClass('bigger-inner', 1000);
  }, 
  function () {
    $(this).removeClass('bigger-outer', 1000);
    $(this).find('.inner').removeClass('bigger-inner', 1000)
  }
);

Answer 1

clearQueue will empty the queue, but it will leave the current animation (if there is any) running.

If you want to stop the current animation as well, see stop(), and set both parameters to true (first to clear the queue and the second to jump to the end).

As for where to put them, you’ll most likely want it in both event handlers;

$('.one').hover(
  function () {
    $(this).stop(true, true).addClass('bigger-outer', 1000);
    $(this).find('.inner').addClass('bigger-inner', 1000);
  }, 
  function () {
    $(this).stop(true, true).removeClass('bigger-outer', 1000);
    $(this).find('.inner').removeClass('bigger-inner', 1000)
  }
);

Note that jQuery’s addClass() does not accept a second parameter; it’s effect is instantaneous, but jQuery UI does (apparently, which is stupid).