Jquery 上下文菜单不显示子菜单

在这里，我有一个菜单，当你点击画布时会显示出来。将鼠标悬停在“聚合”菜单项上时，右侧会显示第二个子菜单

问题是，如果您从“聚合”中“鼠标移出”，然后再次输入，则子菜单的位置不再是它应该位于的位置。这个代码怎么了

HTML

CSS

将此行

$（“#menu2”）.offset（{top:top+20，left:left+120}）

在

mouseenter

函数之外，以避免在每次鼠标输入时执行它

$('#li1').mouseenter(function() {
    //$("#menu2").offset({ top: top+20, left: left+120 });
    $("#menu2").show();
});

$("#menu2").offset({ top: top+20, left: left+120 });

放置此行

$（“#menu2”）。偏移量（{top:top+20，left:left+120}）

在

mouseenter

函数之外，以避免在每次鼠标输入时执行它

$('#li1').mouseenter(function() {
    //$("#menu2").offset({ top: top+20, left: left+120 });
    $("#menu2").show();
});

$("#menu2").offset({ top: top+20, left: left+120 });

---

尝试用

css

替换

offset

我认为每次在

mouseenter

上调用

offset

，它都会添加到该菜单的当前位置

---

使用

css

方法将设置顶部和左侧位置，而不是添加到当前位置。

尝试用

css

替换

offset

我认为每次在

mouseenter

上调用

offset

，它都会添加到该菜单的当前位置

---

使用

css

方法将设置顶部和左侧位置，而不是添加到当前位置。

使用css可以实现您尝试的许多操作。悬停状态无需使用JS（鼠标[输入|离开]）。虽然不是一个完美的例子，我做了一个。谢谢，我最终实现了你的想法。你尝试做的很多事情都可以通过CSS实现。悬停状态无需使用JS（鼠标[输入|离开]）。虽然不是一个完美的例子，我做了一个。谢谢，我最终实现了你的想法。谢谢，这很有帮助，但是如果我再次单击画布并更改菜单的位置，子菜单不会正确显示我知道。。。我正在做这件事。。。但另一个答案是你的解决方案；）我向上投票@Mr.Meeseek…谢谢，这很有帮助，但是如果我再次点击画布并改变菜单的位置，子菜单不会正确显示我知道。。。我正在做这件事。。。但另一个答案是你的解决方案；）我把票投给了米先生。。。

.context-menu {
  border:1px solid rgba(0,0,0,.15);
  background-color:#ffffff;
  padding:6px 0 0 0;
  display:none;
}
.context-menu ul {
  padding:0;
  list-style:none;
}
.context-menu li {
  background-color:#ffffff;
}
.context-menu li:hover {
  background-color:rgb(248,248,248);
}
.context-menu a {
  color:#333;
  text-decoration: none;
  line-height:24px;
  margin-left:20px;
}
#menu1{
  position:absolute;
  width:140px;
}
#menu2{
  position:absolute;
  width:100px;
}

$('#li1').mouseenter(function() {
    //$("#menu2").offset({ top: top+20, left: left+120 });
    $("#menu2").show();
});

$("#menu2").offset({ top: top+20, left: left+120 });