jquery - 如何以固定高度 UL 滚动 LI 元素?

标签 jquery css scroll html-lists

这是我的示例 HTML。

我想为我的 LI 元素滚动。

有 2 个级别。意思是,我想在每个 UL 上申请类(class)。

那我该怎么做呢。通过使用 JQuery 或 CSS 调整。

PS:我用的是这个example .

<ul id="nav" class="dropdown">
<li class="dir">
    Item_Root
    <ul>
        <li class="dir">
            Item_1_Level
            <ul>
                <li>Item_Level_2</li>
                <li>Item_Level_2</li>
                <li>Item_Level_2</li>
                <li>.... up to N items</li>
            </ul>
        </li>
        <li>Item_Level_1</li>
        <li>Item_Level_1</li>
        <li>Item_Level_1</li>
        <li>Item_Level_1</li>
        <li>.... up to N items</li>
    </ul>
</li>

 </ul>  

最佳答案

根据您发布的标记,以及我对您问题意图的最佳猜测(您的标题与您链接到的示例并不完全匹配),我想出了这个:

#nav {
    width: 12em;
    height: 20em;
    line-height: 2em;
    border: 1px solid #ccc;
    padding: 0;
    margin: 0;
    overflow: scroll;
    overflow-x: hidden;
}

li {
    border-top: 1px solid #ccc;
}

ul ul {
    text-indent: 1em;
}

ul ul ul {
    text-indent: 2em;
}

JS Fiddle Demo .

关于jquery - 如何以固定高度 UL 滚动 LI 元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4604059/

相关文章:

jquery - Twitter Bootstrap 移动菜单不起作用

javascript - 使用箭头按钮和 javascript 向左或向右移动图像显示栏

javascript - 如何在 jquery 中向 $(window).resize 事件添加 if 条件?

jquery - 动态编辑html表格的单元格

jquery - 滚动上的 anchor 突出显示在 Firefox 中不起作用

javascript - 如何仅在鼠标滚轮滚动时触发

Android webview 在 2.3 中不滚动,但在 3.0 和 4.0 中工作

javascript - 使用 JQuery 查找表列中的重复值并检查值范围

html - 如何使用图形按钮

javascript - jquery 中的 mouseenter 导致异常行为