I use js-library JGraph. I change my styles as follows:
var mxPopupMenuShowMenu = mxPopupMenu.prototype.showMenu;
mxPopupMenu.prototype.showMenu = function()
{
mxPopupMenuShowMenu.apply(this, arguments);
var _div = this.div;
_div.style.backgroundColor = 'darkgrey'; // background color
_div.style.border = 'none'; // border
_div.onmouseover = function(){ // over in
console.log('mouse over in popur');
}
_div.onmouseout = function(){ // over out
console.log('mouse over out popur');
}
};
This working, but i want edit background color at hover on submenu, and i want edit font color whole menu. How it making? Thanks.
I find method set style for jgraph popup menu, using css:
body div.mxPopupMenu {
-webkit-box-shadow: 3px 3px 6px #C0C0C0;
-moz-box-shadow: 3px 3px 6px #C0C0C0;
box-shadow: 3px 3px 6px #C0C0C0;
background: darkgrey;
color: white;
border: none;
position: absolute;
padding: 3px;
}
body table.mxPopupMenu {
border-collapse: collapse;
margin: 0px;
}
body tr.mxPopupMenuItem {
color: white;
cursor: hand;
}
body td.mxPopupMenuItem {
padding: 6px 60px 6px 30px;
font-family: Arial;
font-size: 10pt;
}
body td.mxPopupMenuIcon {
background-color: white;
padding: 0px;
}
body tr.mxPopupMenuItemHover {
background-color: black;
color: white;
}
table.mxPopupMenu hr {
border-top: solid 1px #cccccc;
}
table.mxPopupMenu tr {
font-size: 4pt;
}