如何设置在jQuery mmenu中打开子菜单的箭头样式?

时间:2015-08-19 13:30:39

标签: jquery css3 mmenu

有谁知道如何生成打开(垂直)子菜单的mmenu中的箭头以及如何通过css设置它的样式?任何提示都表示赞赏。谢谢。

Link to mmenu website

1 个答案:

答案 0 :(得分:0)

这些箭头的css样式如下:

.mm-prev:before, .mm-next:after, .mm-arrow:after {
    content: '';
    border: 2px solid transparent;
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    border-color: rgba(0, 0, 0, 0.3);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

如果将此css应用于锚点,则会有一个45度旋转的框,边框线为2像素。然后,您可以删除所需的每一边的边框,如下面的代码,以获得右侧箭头:

.mm-next:after, .mm-arrow:after {
    border-top: none;
    border-left: none;
    right: 20px;
}

以及代码下面有左箭头:

.mm-next:after, .mm-arrow:after {
    border-bottom: none;
    border-right: none;
    right: 20px;
}