Javascript Jquery悬停并隐藏另一个div_Javascript_Jquery

Javascript Jquery悬停并隐藏另一个div

javascript jquery

Javascript Jquery悬停并隐藏另一个div,javascript,jquery,Javascript,Jquery,我正在使用superfish菜单，我有一个问题在标题中，我有一个徽标支架div，里面有徽标徽章div和徽标名称div。当用户将鼠标悬停在顶级链接上时，将显示sf mega drop菜单，并将一类.sfHover应用于父级li 我的问题是，我需要在下拉菜单顶部显示徽标徽章，而不是徽标名称div 使用z-索引已经过时了，我想是的（我已经尝试过），所以我想在.sfHover类在菜单li上处于活动状态时隐藏logo name div，所以我有这个代码，但它没有隐藏它 if ($('#mainMenu.

我正在使用superfish菜单，我有一个问题

在标题中，我有一个徽标支架

div

，里面有徽标徽章

div

和徽标名称

div

。当用户将鼠标悬停在顶级链接上时，将显示sf mega drop菜单，并将一类

.sfHover

应用于父级

li

我的问题是，我需要在下拉菜单顶部显示徽标徽章，而不是徽标名称

div

使用z-索引已经过时了，我想是的（我已经尝试过），所以我想在

.sfHover

类在菜单

li

上处于活动状态时隐藏logo name div，所以我有这个代码，但它没有隐藏它

if ($('#mainMenu.sf-menu ul li').hover().hasClass('sfHover') == true) {
    $('.logoHolder .kingsworthName').hide();
}

非常感谢您的帮助。

您在这里使用的是错误的。它期望处理函数作为参数。您应该这样使用它：

$('#mainMenu.sf-menu ul li').hover(
   function() {  // when the mouse pointer enters the element.
     if ($(this).hasClass('sfHover')) {
         $('.logoHolder .kingsworthName').hide();
       }
     },
   function () {} // when the mouse pointer leaves the element.
);

您可以使用纯css。这是链接

//css FILE
.box {
  height: 300px;
  width: 300px;
  background: red;
}

.hidden {
  height: 100px;
  width: 100px;
  background: white;
  display:none;
}

.box:hover .hidden {
    display: block;
}

//HTML

<html>


<body>
  <div class="box">
    <div class="hidden">
      Hello there
    </div>
  </div>
</body>
</html>

//css文件
.盒子{
高度：300px；
宽度：300px；
背景：红色；
}
.隐藏{
高度：100px；
宽度：100px；
背景：白色；
显示：无；
}
.box:悬停。隐藏{
显示：块；
}
//HTML
你好

我没有得到你的布局的完整的心理形象，但是在很多情况下，你可能会考虑CSS解决方案。