Question

我试图让一个div仅在其他div / div可见或悬停menuButton时可见。

示例：

当我悬停菜单中的一个按钮时，我的“hiddenDiv”将会出现。它应该保持可见，直到我从hiddenDiv中留下鼠标。之后，hiddenDiv再次隐藏。

当我点击我的hiddenDiv时，当它可见时，会出现另一个div。我的hiddenDiv现在应该保持可见，直到新的div（我有多个这些）可见。

CODE

JS：

$('#menuButton').mouseover(function() {
$('#pasMenTypy').hide();
$('#aktMenTypy').show();
$('.hiddenDiv').show();

$('.hiddenDiv').mouseover(function() {
$('.hiddenDiv').show();
    }); 
});

if($('#div1').is(':visible') || $('#div2').is(':visible') || $('#div3').is(':visible') || $('#div4').is(':visible') || $('#div5').is(':visible') || $('#div6').is(':visible') || $('#div7').is(':visible') || $('#div8').is(':visible')) {

$('.hiddenDiv').show();

} else {

$('.hiddenDiv').mouseout(function() {
$('.hiddenDiv').hide();
 });
}

它当前显示hiddenDiv，当悬停menuButton时，但当div1或div2或...或div8可见时它不会保持可见。你能帮忙吗？

编辑：这是小提琴： http://jsfiddle.net/8SPj3/ ...当我正在徘徊menuButton1时，我希望hiddenDiv出现，当我在徘徊menuButton2时，我希望它隐藏起来。当我从hiddenDiv点击“blah”时，我希望div1可见，我也希望隐藏的div保持可见。现在，只有当我点击menuButton2时，hiddenDiv才会隐藏。

Answer 1

更改代码

    $('#menuButton').mouseover(function () {
        if ($('#div1').is(':visible') || $('#div2').is(':visible') || $('#div3').is(':visible') || $('#div4').is(':visible') || $('#div5').is(':visible') || $('#div6').is(':visible') || $('#div7').is(':visible') || $('#div8').is(':visible')) {
            $('.hiddenDiv').show();
        }
    });


    $('#menuButton').mouseout(function () {
        $('.hiddenDiv').hide();
    });

修改

Fiddle

Updated fiddle

Answer 2

试试这段代码：

$('#menuButton').mouseover(function() {
    $('#pasMenTypy').hide();
    $('#aktMenTypy, .hiddenDiv').show();
});

if ($('#div1, #div2, #div3, #div4, #div5, #div6, #div7, #div8').is(':visible')) {
    $('.hiddenDiv').show();
} else {
    $('.hiddenDiv').hide();
}

只有当其他div可见时才让div可见

2 个答案: