jQuery - 扩展菜单

Question

我想实现以下几点。我有几个小图像，如果鼠标在其中一个图像上，div 或一些按钮应该会变得可见。但是如果鼠标移动到另一个图像，另一个div（按钮）应该被显示，旧的div应该被隐藏。如果未选择任何图像，则不应显示任何内容。 jQuery 库中是否有任何函数可以做类似的事情？

我尝试使用mouseover 函数和toogle() 来做到这一点。但问题是，当鼠标离开图像时，最近显示的div 又被隐藏了。此外，如果我将div 设置为在mouseover 上可见，即使选择了另一个图像，它仍然会显示。

<div id="Div1">This is div1</div>
<div id="Div2">This is div2</div>​

当鼠标经过“div1”时，“div2”应该会一直显示，直到鼠标离开“div1”或“div2”。这意味着，如果鼠标移过“div2”（鼠标左移“div1”），“div2”仍应显示。

Answer 1

听起来你想要jQuery hover。很难提供准确的答案，因为您的问题不包含代码，但这符合您的描述。

$(document).ready(function() {
    $("#myDiv").hover(
      function() {
        $("#otherDiv").show();
      }, 
      function() {
        $("#otherDiv").hide();
      }
    );
});

jsFiddle DEMO

编辑

$(document).ready(function() {
    $("#wrapper").hover(
      function() {
        $("#otherDiv").show();
      }, 
      function() {
        $("#otherDiv").hide();
      }
    );
});​

CSS：

#otherDiv {
    display: none;
}

HTML：

<div id="wrapper">
    <div id="myDiv">hover me</div>
    <div id="otherDiv">stuff</div>
</div>​

Updated Demo