Mouseout on specified divs and keep original div open

Question

I\'m trying to do this in plain english: I have an open div from a mouseover event, when I take the mouse out of the div it closes on mouse out, perfect. What I need is that whe

Answer 1

Why don't you simply keep your simple hover logic as it is (hide on mouse out) but then simply re-show it when the mouse is over the X or Y div.

$('#openDiv').mouseout(function() {
    $(this).hide();
});

$('div.x').mousein(function() {
    $('#openDiv').show();
});

If you make your $('div.x') selector have an ID or at least a context that isn't the entire DOM, I bet the "flicker" from hiding then showing again isn't even noticeable.

Answer 2

$("#openDiv").mouseout(function (e) { //you forgot to add the event `e` element
    var $c = $(e.target);
    if ($c.is('div.x') || $c.is('div.y')) //you forgot $c.is on the second part
    {
        $("#openDiv").show(); 
    } else {
        $("#openDiv").hide(); 
    }
});