Тонкая наклонная область для jQuery скользящих боксов

Question

Я использую jQuery для создания 3-х ящиков, которые при наведении, слайды, чтобы показать больше контента. Мои два вопроса:

1) Как я могу его настроить, так что только зависание на сером поле фактически активирует слайд, а не всю невидимую область над серой рамкой?

2) Есть ли лучший способ достичь этого? Я новичок, когда дело доходит до JavaScript, и взломал несколько вещей, которые я нашел в поиске Google вместе. Например, было бы неплохо, чтобы высота генерировалась автоматически на основе содержимого вместо того, чтобы полагаться на фиксированную высоту.

http://jsfiddle.net/kUjax/

$(document).ready(function(){ 
    $('.boxgrid.caption').hover(function(){ 
     $(".cover", this).stop().animate({top:'120px'},{queue:false,duration:150}); 
    }, function() { 
     $(".cover", this).stop().animate({top:'210px'},{queue:false,duration:150}); 
    }); 
}); 

Answer 1

Вы почти сделали это сами:

$(document).ready(function() { 
    $('.boxgrid .boxcaption').hover(function() { 
     $(this).stop().animate({top: '120px'}, { 
      queue: false, 
      duration: 150 
     }); 
    }, function() { 
     $(this).stop().animate({top: '210px'}, { 
      queue: false, 
      duration: 150 
     }); 
    }); 
}); 

http://jsfiddle.net/kUjax/1/