0

我使用 jquery hover 来显示项目详细信息,然后用户将鼠标悬停在此页面上的项目上 - dev.oyehabla.com 问题是,然后鼠标离开项目细节必须隐藏但有时它们仍然存在......是 jquery 错误还是我'我做错了什么?我使用这段代码:

jQuery('#big_container .item-image').hover(function(){
   var $opt = $(this);
   $item_id = $opt.attr("id");
   $post_id = $item_id.split('-');
   jQuery('#'+$item_id + ' .media_block .post-detail').show();
   console.log($item_id + 'mouseover')
},function(){
   var $opt = $(this);
   $item_id = $opt.attr("id");
   $post_id = $item_id.split('-');
   jQuery('#'+$item_id + ' .media_block .post-detail').hide();
   console.log($item_id + 'mouseout')    
});
4

2 回答 2

0

您可能应该为此使用 CSS 而不是 jQuery,特别是如果您只是显示/隐藏 div。先试试这个:

$('#big_container .item-image').hover(function(){
   var $opt = $(this);
   $opt.find('.post-detail').show();
},function(){
   var $opt = $(this);
   $opt.find('.post-detail').hide();
});

这可能会解决您的问题。使用 CSS 的更好版本:

#big_container .item-image .post-detail {
  display: none;
}

#big_container .item-image:hover .post-detail {
  display: block;
}
于 2013-04-19T20:59:21.103 回答
0

您不需要整个功能..只需使用这部分

jQuery('#big_container .item-image').hover(function(){
   var $opt = $(this);
   $item_id = $opt.attr("id");
   $post_id = $item_id.split('-');
   jQuery('#'+$item_id + ' .media_block .post-detail').stop().show();
   console.log($item_id + 'mouseover')
});
于 2013-04-19T21:03:59.543 回答