1

我在开发 jQuery '对象' 时遇到问题。我希望 div1(请参阅下图)成为背景 div,其中包含图像(使用背景图像)。然后我希望 div 2(请参阅下图)覆盖 div 1,我可以这样做。然而,由于我对 jQuery 没有什么经验,所以我正在努力解决下一部分。我想,当您将鼠标悬停在 div 2 上时,我使用 jQuery slideDown() / slideUp() 来显示和隐藏 div 3(请参阅下图)。它也不需要在向上滑动时关闭(因为光标将不再位于 div 2 上)。只有当您不再将鼠标悬停在整个对象上时,它才会关闭。我希望这是有道理的......我只是不知道从哪里开始。如果需要更多信息,请询问。

问题说明

4

1 回答 1

3

我相信这样的事情应该做到这一点,或者至少它为您提供了一个可以尝试并进一步改进的起点。

标记

<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/

于 2012-08-19T13:45:16.287 回答