Jquery, ASP.NET. Hovering a dropdown panel and menu button at same time in -
ive got menu , drop-down panel. when hovering on menu panel falls down. want menu , drop down highlighted @ same time.
my code working nicely when hover on menu highlighting menu adds , wont vanish when hover out menu.
<script type="text/javascript"> $(window).load(function () { $(".menu-item").hover(function () { $(".menu-item").removeclass('menuhighlighted'); $(this).addclass('menuhighlighted'); }); $(".panel-item").hover(function () { $(this).addclass('listhighlighted'); $(this).parents('.menu-item').addclass('menuhighlighted'); }, function () { $(this).removeclass('listhighlighted'); $(this).removeclass('menuhighlighted'); }); }); </script> i believe im done, there 1 little thing left cant figure out. have been trying add:
$(".menu-item").mouseleave(function () { $(this).removeclass('menuhighlighted'); }); but wont work. other suggestions me.
you have provide 2 callback functions hover function in jquery; 1 called when move over, , 1 called when move out.
and final callback $(this).removeclass('menuhighlighted'); removes class panel-item never there, meant parent menu-item.
edit 2:
add classes on mouseenter of menu-item, remove them when leaving panel.
so, this:
$(window).load( function () { $(".menu-item").mouseenter( function () { $(".menu-item").removeclass('menuhighlighted'); $(this).addclass('menuhighlighted'); } ); $(".panel-item").hover(function () { $(this).addclass('listhighlighted'); }, function () { $(this).removeclass('listhighlighted'); }); $("#pnclub").mouseleave(function () { $('.menu-item').removeclass('menuhighlighted'); }); });
Comments
Post a Comment