javascript - 如何在 JGraph 的流行菜单中设置样式？

Question

我使用 js 库 JGraph。我改变我的风格如下:

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');
    }
};

这有效，但我想在悬停在子菜单上时编辑背景颜色，并且我想编辑整个菜单的字体颜色。它是如何制作的？谢谢。

Answer 1

我找到了使用 css 为 jgraph 弹出菜单设置样式的方法:

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;
}