Question

我有一个由jQuery面板组成的左侧菜单。它的高度是全屏的。如何将其缩短到与其内容一样高的大小（此场景中的ul属性）。我甚至无法从div样式手动编辑其高度（宽度：100px;高度：10px不起作用。）。 jQuery面板的任何特定原因？

有什么想法吗？

<script type="text/javascript" src="js/jquery.mobile-1.4.5.min.js"></script>
<!--LEFT TOP MENU PANEL-->
    <div data-role="panel" id="leftMenu" data-position="left" data-display="overlay" data-theme="a" data-overlay-theme="a" style="width:170px;">
        <ul data-role="listview">
            <li data-icon="false"><a id="a" href="#">Show A Items</a>
            </li>
            <li data-icon="false"><a id="b" href="#">Show B Items</a>
            </li>
            <li style="display:none" data-icon="false"><a>Show C Items</a>
            </li>
            <li data-icon="false"><a id="c" data-transition="none" href="#show_pollen">Show D Items</a>
            </li>
        </ul>
    </div>

Answer 1

好的，我刚刚编辑了jquery.mobile.css。找到.ui-panel的min-height属性，并将其设置为0％，将max-height设置为20％也很重要。

.ui-panel{width:17em;min-height: 0%;max-height: 20%;border-width:0;position:absolute;top: 160px;display:block;}

JQuery面板 - 左菜单高度

1 个答案: