Check if the mouse is over multiple elements in JQuery?
So I am working on a dropdown menu and ran into a problem ... here is the code ...
$('#layer2_cell1').hide();
$("#layer1_cell1").mouseenter(function () {
$('#layer2_cell1').show();
$("#storage").data('airplanesmain', '1');
});
$("#layer1_cell1").mouseleave(function () {
$("#storage").data('airplanesmain', '0');
var subcell = $("#storage").data('airplanessubcell');
if (subcell == '0') {
$('#layer2_cell1').hide();
}
});
$("#layer2_cell1").mouseenter(function () {
$("#storage").data('airplanessubcell', '1');
});
$("#layer2_cell1").mouseleave(function () {
$("#storage").data('airplanessubcell', '0');
});
I'm trying to hide layer2_cell1, if my mouse is outside of layer1_cell1 and layer2_cell1, it looks like it will do it, but it dosnt. Help!
+3
source to share
1 answer
Hi I only wrote the CSS menu here http://jsfiddle.net/P8ZH6/3/ as there is no need to use JavaScript.
You can attach JavaScript events to menu items if you need to display dynamic content above the menu.
Something like this might work.
$ (document) .ready (function () {
$(".menu li").hover(function(){
$("#dynamic_content").html($(this).parents(".menu_1").find("span").html() + "->" + $(this).find("a").text());
})
$(".menu .menu_1 span").hover(function(){
$("#dynamic_content").html($(this).html());
})
$(".menu li, .menu .menu_1 span").mouseout(function(){
$("#dynamic_content").html("");
});
});
Hope this works for you.
0
source to share