Stack jQuery events on elements to avoid delays.

While building a bit of code for phlodl.com jQuery was acting up when adding a simple mouseover to expand and the event was delayed when the mouse entered the element. To fix this I daisy-chained the events on the element to fix the delays:

Delayed animation:

$('.feature').mouseenter( function() {
$(this).animate({
height: 540
}, 'fast', function() {});
});

$('.feature').mouseleave( function() {
$(this).animate({
height: 300
}, 'fast', function() {});
});


Seamless:

$('.feature').mouseenter( function() {
$(this).animate({
height: 540
}, 'fast', function() {});
}).mouseleave( function() {
$(this).animate({
height: 300
}, 'fast', function() {});
});