Recently, I encountered an issue with a menu that adds a
https://i.sstatic.net/A0J2U.png
Within the menu, there is jQuery code that functions to add a class on hover and remove it on mouse-out. The code snippet looks something like this...
$(document).ready(function(){
$('.actions-menu').hover(function(){
$(this).addClass('active');
$(this).find('.actions-list').show();
}, function(){
$(this).removeClass('active');
$(this).find('.actions-list').hide();
});
});
The problem arises when a button icon within the popover menu is hovered over, causing a tooltip to appear. If you then hover over this tooltip, it triggers the mouseout event in the aforementioned code, which closes the menu unexpectedly.
To resolve this issue, I am seeking a solution to ensure that the menu remains open even when hovering over a tooltip with CSS class .hastip
.
If you have any insights or suggestions on how I can achieve this, please advise. Thank you!