1

我正在尝试为侧面板制作多级菜单。我正在使用的代码在这个小提琴中。它有点工作,但可折叠元素的内容格式错误,列表的内容在两边都被剪掉了(在 Firefox 或 Google Chrome 中尝试过)。这样做的正确方法是什么?我不喜欢这个 data-inset="true"选项,因为它改变了整个外观。我只是希望它是全宽的,但有正确的填充。另一方面,如果有其他方法可以做到这一点(比如带有无法展开的元素的可折叠集合),我愿意接受建议。

免责声明:我完全是 jqm 和 web 开发的菜鸟。

4

1 回答 1

1

解决方案

这是一个工作示例:http: //jsfiddle.net/Gajotres/m6zVq/

这个 css 将解决您的问题,并且不会干扰其他列表视图:

.ui-collapsible div ul {
    margin: -0.6em 0 !important; //counter top/bottom margins without changing default ones
}

.ui-collapsible div ul .ui-corner-top, .ui-collapsible div ul .ui-corner-bottom {
    border-radius: 0; // remove border radius
} 

.ui-collapsible div ul li.ui-li-divider {
    padding: 0.5em 15px 0.5em 12px !important;
}

编辑 :

这是另一个解决方案:http: //jsfiddle.net/Gajotres/BfGJY/

没有CSS。但仍然是一种解决方法。可折叠元素上方有一个列表视图,其下方有一个列表视图。

更多信息

如果您想自己学习如何进行这种更改,您应该查看这篇文章,它将教您如何自己进行。

于 2013-01-23T11:59:27.750 回答