0

我正在使用 slimscroll 插件,但我遇到了滚动条不可见的问题。

我的代码:

 <script type="text/javascript" charset="utf-8">
    // JavaScript Document
    $(document).ready(function()
    {
        $("#formActions").slimScroll({
            height: '400',
            color: '#00f',
            alwaysVisible: true
        });
    });
</script>

HTML:

<div class="content" style="height:400px;">
<div id="formActions">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tellus diam, gravida sit amet lobortis vel, vehicula in nisl. Mauris commodo tristique adipiscing. Ut ac odio ut leo molestie rhoncus id ac sem. Duis interdum neque ligula, aliquet scelerisque urna tincidunt sit amet. Donec dapibus ultrices velit. Aliquam eleifend pretium neque, in adipiscing tortor malesuada sit amet. Proin mattis erat quis hendrerit sodales. Ut tincidunt consequat lorem, ut sodales purus gravida nec. Morbi mollis dolor quis dapibus lacinia. Nulla ultricies velit ut porta varius. Vestibulum ac egestas lacus.

Praesent id ultrices felis, ut porttitor nunc. Maecenas quis leo laoreet, laoreet enim eget, euismod libero. Morbi viverra laoreet mollis. Mauris sit amet ultrices sapien. Praesent et malesuada purus, et ornare orci. Mauris accumsan enim tincidunt, eleifend enim vitae, dictum enim. Duis eleifend vehicula metus, vitae eleifend leo imperdiet id. Quisque hendrerit venenatis quam eget egestas. Suspendisse faucibus in sapien sit amet malesuada. Vivamus id neque varius, volutpat velit id, viverra ligula. Duis convallis nisl eu sapien fringilla porta. Curabitur cursus nisl quis tortor porttitor, non volutpat sapien rhoncus. Maecenas tincidunt sem ligula. Duis tellus enim, volutpat sed mollis eu, faucibus sit amet leo. Maecenas volutpat mauris dolor, sed auctor ligula aliquam eget. Proin tincidunt ornare lacus, ac egestas mauris scelerisque sit amet.

Mauris sit amet diam magna. Sed rhoncus erat ac tortor imperdiet porta. Proin et nulla sed quam posuere pulvinar quis id mi. Vestibulum mollis elementum metus et sagittis. Nunc vel luctus neque. Mauris ac neque orci. Sed suscipit augue quis convallis vulputate. Duis laoreet libero a eros rhoncus, ac congue libero egestas. Mauris ac purus eget urna convallis aliquam a sit amet quam. Mauris mi erat, egestas nec dignissim sed, vulputate sit amet dolor. Pellentesque auctor nibh eget diam rutrum dictum. Praesent porttitor orci ante, ac hendrerit lacus hendrerit vel. Suspendisse sodales est sed ipsum mollis, eget tempus tellus laoreet. Phasellus vehicula congue sem at mattis. Vestibulum in libero tincidunt, tempus odio accumsan, viverra urna. Cras molestie vel sem nec laoreet.</div>
</div>

当我将 slimScroll 函数中的高度设置为 200 时,它会起作用所以看起来该函数有效,但滚动条仍然没有显示。当我在浏览器中查看源代码时,我看到了容器 slimScrollDiv。我还看到 slimScrollBar 类的高度没有设置。也许这会导致问题。

有任何想法吗?

4

2 回答 2

4

如果您使用的是动态数据,请确保在调用 slimScroll 函数之前您的 DOM 已填充数据。如果是这种情况,请将 setTimeout 与 0 一起使用。

例如:

setTimeout(function () {
    $("#formActions").slimScroll({
        height: '400',
        color: '#00f',
        alwaysVisible: true
    });
},0);
于 2015-01-23T11:02:48.397 回答
1

对于其他有此问题的人,您需要通过设置display:block来覆盖.slimScrollBar类。

例子

.slimScrollBar{display:block !important;}
于 2014-07-11T21:13:37.670 回答