1

2 つの div があります。Div A (display:noneデフォルト) と Div B (常に表示)。マウスが Div B の上に移動すると、Div A が表示されるようにするにはどうすればよいでしょうか。マウス カーソルが Div A または Div B のいずれかにある場合、Div A は表示されたままである必要があります。そうでない場合、Div A は非表示になります。

これには jQuery プラグイン hoverIntent を使用しています。

$(".the-dropdown").hoverIntent( function(){
        $(".the-dropdown").show();
    }, function(){
        $(".the-dropdown").hide();
});

$(".menu-item").hoverIntent( function(){
    $(".the-dropdown").show();
}, function(){
    $(".the-dropdown").hide();
});

jsfiddle

4

2 に答える 2

3

うーん、このようなものを試してみてください。

HTML:

<div id="a"></div>
<div id="b"></div>

CSS:

div {
    height: 200px;
    width: 200px;
}
#a {
    background: #0f0;
    display: none;
}
#b {
    background: #f0f;
}

JS:

$('#a, #b').hover(function() {
    $('#a').show(); 
}, function() {
    $('#a').hide();    
});

フィドル

またはあなたの特定のケースでは:

$(".the-dropdown, .menu-item").hover( function(){
        $(".the-dropdown").show();
    }, function(){
        $(".the-dropdown").hide();
});
于 2013-09-18T21:51:59.560 に答える