如果父菜单处于鼠标移出状态或菜单本身处于鼠标移出状态，则隐藏菜单
如果父菜单处于鼠标移出状态或菜单本身处于鼠标移出状态，则隐藏菜单
提问于 2014-06-15 08:03:54
我创建了一个简单的菜单，当将鼠标悬停在父元素上时，菜单本身就会出现。然而，我试图做的是，当用户的鼠标悬停在父元素或菜单本身之外时，它将消失。
菜单的HTML结构
<div class="tab">
<div id="shop" class="source tabFace">
Shop
</div>
<div class="tabHidden">
<?php
wpsc_start_category_query(array(‘category_group’=> 1, ‘show_thumbnails’=> 1));
?>
<div class="tabRow source">
<a href="<?php wpsc_print_category_url();?>">
<?php
wpsc_print_category_name();
?>
</a>
</div>
<?php
wpsc_end_category_query();
?>
</div>
</div>在我的CSS中，我将.tabHidden类设置为display:hidden;
在我的jQuery中，当用户将鼠标悬停在.tabFace类上时，它将生成动画并使隐藏的菜单可见
$(".tab").each(function(e){
var parent = $(this);
$(this).children(".tabFace, .tabHidden").on("mouseover", function(){
$(this).parent().children(".tabHidden").css("display","block");
$(this).parent().children(".tabHidden").stop().animate({
"opacity":"1",
"top":"0"
});
});
});我正在尝试弄清楚如何在用户悬停在faceTab或tabHidden类之外后使其淡出。
回答 1
Stack Overflow用户
发布于 2014-06-15 11:59:58
如何使用jquery mouseout，为类创建一个事件，并通过在event函数中使用它来分别淡出每个元素。
$('.tabHidden').mouseout(function(){
$( this ).fadeOut( "slow", function() {
// Animation complete.
});
});信息：http://api.jquery.com/mouseout/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/24225402
复制相关文章
相似问题
腾讯云开发者
