Nanoscroller.js - 文本溢出但不滚动条？

Question

如果内容太多，我正在使用Nanoscroller（http://jamesflorentino.github.io/nanoScrollerJS/）来尝试滚动侧边栏。但是，我发现文本溢出了div（正如预期的那样，因为它是一个固定的高度）但滚动条没有出现！所以它只是流向页面并通过页脚。它看起来像这样：

有谁知道是什么原因引起的？我使用的代码位于：http://pastebin.ca/2627843

关键位（我认为）是：

<script type="text/javascript">
        $(window).load(function() {
                $('.nano').nanoScroller();
        });
</script>

和

        background-color:red;
        float:left;
        width: 500px;
        height: 500px;
}


/* Scrolling */

.nano {
        background: #bba;
        width: 500px;
        height: 500px;
}

.nano .content {
        padding: 10px;
}

.nano .pane   {
        background: #888;
}

.nano .slider {
        background: #111;
}

任何评论都表示赞赏。谢谢。

Answer 1

需要以下类型的标记结构才能使插件正常工作：

<div id="sidebar" class="nano">


 <div class="content"> 

 ... content here ...  


 </div> 


</div>

和

$(document).ready(function(){
        $('#sidebar').nanoScroller({ scroll: 'top' });
    });

演示jsfiddle

和css一样，

.nano { width: 500px; height: 500px; }
.nano .content { padding: 10px; }
.nano .pane   { background: #888; }
.nano .slider { background: #111; }