Hello,
I have a list for which I have defined hover css so that a button shows when hovering over the list item. When hovering over the button on thats in the list item, I display a list widget with options the user can choose from. Of course as soon as you move your cursor onto the list, the parent list item hides the hover buttons because the cursor is moved off the list item onto the menu. Is there a way to keep the parent list item showing as if still hovering over it? Or can this be done in a different way with the same result?
the menu that shows on hover:
const shortcut_options = webix.ui(
{view:“suggest”, id:“shortcutOptionsMenu”, margin:0, padding:0, height:80,
body:{view:“form”, id:“shortcutOptionsForm”, borderless:true, elements:[
{view:“menu”, id:“shortcutOptionslist”, layout:“y”, select:true, scroll:false,
type:{height:25,width:220},
data:[
{id:1, value:“Add Application Shortcut”},
{id:2, value:“Add Session Shortcut”},
{id:3, value:“(You can also Drag and Drop)”}
],
]}});
the code that detects the hover (in the onMouseMove event of the parent list)
if (e.srcElement.className == ‘webix_icon far fa-share-square’)
shortcut_options.show(e.srcElement,{pos:‘bottom’});
else
shortcut_options.hide();
how it looks when hovering over the share-square icon:
how it looks when moving the move into the options menu:
