jQuery切换悬停多个实例

Question

当前悬停在一个div上会导致所有三个一次切换。试图弄清楚如何只将当前悬停的物品切换到当时切换。虽然我可以给每个人一个唯一的ID并复制每个的javascript规则，但我认为有一种更简洁的方式，而不必添加额外的唯一类，因为在演示中会有超过三个。

代码：http://codepen.io/anon/pen/BNdggv

$( ".product" ).hover(function() {
  $( ".product-caption.odd" ).toggle( "slide",{direction:"left"},500);
  $( ".product-caption.even" ).toggle( "slide",{direction:"right"},500);

});

Answer 1

使用$(this).find()获取悬停元素的产品标题

Demo

$( ".product" ).hover(function() {
  $(this).find(".product-caption.odd" ).toggle( "slide",{direction:"left"},500);
  $(this).find(".product-caption.even" ).toggle( "slide",{direction:"right"},500);

});