jQuery slideUp()问题

Question

我在开发jQuery 'object‘时遇到了麻烦。我希望div1 (参见下图)作为背景div，其中包含一个图像(使用背景图像)。然后，我希望div 2(参见下图)覆盖div 1，这是我可以做到的。然而，由于我几乎没有使用jQuery的经验，这是我正在努力解决的下一个部分。我希望，当您将鼠标悬停在div2上时，我会使用jQuery slideDown() / slideUp()来显示和隐藏div3(参见下图)。它还需要在向上滑动时不要关闭(因为光标将不再位于div 2上)。只有当你不再悬停在整个物体上时，它才会关闭。我希望这是有意义的。我只是不知道该从何说起。如果需要更多信息，请联系我们。

​

​

Answer 1

我相信像这样的东西应该能做到这一点，或者至少它给了你一个可以尝试的起点，并进一步提高。

标记

<div class="wrapper">
    <div class="one"></div>
    <div class="two"></div>
    <div class="three"></div>
</div>

CSS

.wrapper {
    float: left;
}
.one {
    background-color: grey;
    width: 100px;
    height: 100px;
}
.two {
    background-color: blue;
    width: 100px;
    height: 20px;
}
.three {
    background-color: green;
    width: 100px;
    height: 100px;
    display: none;
}​

JavaScript

$(function () {
    $(".two").mouseenter(function (){
         $(".one, .three").slideToggle();
    });
    $(".wrapper").mouseleave(function (){
         $(".one, .three").slideToggle();
    });
});​

一个现场示例： http://jsfiddle.net/ZHxe5/1/