Question

我喜欢这个：

        <li class="1"><a href="#">Link</a>
            <ul>
                <li class="item1"><a href="#">1</a></li>
                <li class="item2"><a href="#">2</a></li>
                <li class="item3"><a href="#">3</a></li>
            </ul>
        </li>

当我按下链接时，这些ul项目将向下滑动，但如果它们太多，它们会滑出屏幕。我需要这样做，如果有多个ul项目并且它们开始向下滑动，它会在屏幕的末尾停止并且会出现一个滚动条用于链接。定义高度不是我想要的。我希望这是可以理解的:)谢谢。

Answer 1

我认为你所要做的就是在大多数li上设置一个max-height并且有溢出：滚动它

max-height: 50px;
overflow: scroll;

像这样http://jsfiddle.net/yC32A/

似乎溢出：自动也可以

机智溢出：自动http://jsfiddle.net/yC32A/1/

Answer 2

为了限制li并防止它超出页面的“结束”，我相信你需要使用一些jQuery / JavaScript。这是一个应该做你期望的片段：

var li = $(".item2");
var ul = $(".menu");
var bottom = ul.offset().top + ul.height();
var lim = $("body").height() - bottom + li.height();
li.css({"max-height":lim, "overflow-y":"auto"});

还要确保你的CSS中有这个：

body, html {
    height: 99%;
}

希望有所帮助！

如果元素不适合屏幕，则添加滚动条

2 个答案: