当达到从后端加载的数据的最大高度时，需要实现滑块

Question

我正在从后端加载内容并附加到div。我希望数据以两行显示（高度：100px）。如果它超过2行意味着，我需要在滑块中显示文本。我已经实现了文本滑块。但我需要的是它应该在达到其最大高度后滑动。

<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 col-pad-2 invite-circle-list">
                            <label class="col-lg-12 col-md-12 col-sm-12 col-xs-12 control-label col-pad-2 input-label invite-label">Select circle to invite people</label>
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 col-pad-2" style="height:40px;">
                                <div class="outside prev-top">
                                    <span id="slider-prev-invite"></span>
                                </div>
                                <ul class="bxslider bxslider-invite-friends">
                                    <%
                                    for(var i in data.data) {
                                    %>
                                    <li class="radios pull-left">
                                        <input type="checkbox" name="invite<%=i%>" id="invite-all-fr<%=i%>" value="<%=data.data[i].id%>" data-name="<%=data.data[i].name%>">
                                        <label class="radio" for="invite-all-fr<%=i%>"></label><span class="invite-filter-text"><%=data.data[i].name%></span>
                                    </li>
                                    <%}%>
                                </ul>

                                <div class="outside next-top pull-right">
                                    <span id="slider-next-invite"></span>
                                </div>
                            </div>
                        </div>

这是我的滑块实现代码。结果将如下所示

没有滑块，结果就像。

我需要的是，当结果超过最大高度100时，我需要激活滑块。否则显示文本in2行。

Answer 1

您可以随时将其添加到div

overflow-y: scroll;
max-height: 100px;

所有浏览器都不支持max-height，请记住这一点。我希望它有所帮助。您也可以使用自动而不是滚动。