jQuery hover延时触发

jQuery中的hover用起来十分简单，在配合animate，几乎你能想象到的所有超炫的效果都可以实现。可是越炫的效果持续执行的时间就越长。比如，鼠标放在div上面，div就缓缓上升，鼠标移走，div就缓缓下降。当我们的鼠标快速反复的穿过多个这样的div时，哇……闹鬼了，所有的div忽上忽下的无法停下。

其实，出现这种情况，只需要让事件延时一会儿触发就可以了，大约延时0.2秒就刚刚好。下面我贴出个例子，以便忘记的时候查阅：

$('.grow').hover(function(){
    var _this = $(this);                    // 把$(this)对象赋给一个变量
    trigger = setTimeout(function(){
        _this.animate({height:'150px'},300);// jQuery的setTimeout中不能直接使用$(this)
    },200);                                 // 延迟时间0.2秒
}, function(){
    clearTimeout(trigger);                  // 清除上面的延迟触发的事件
    $(this).animate({height:'70px'},300);
});