javascript - jQuery tinyscrollbar - 不显示所有内容

Question

我遇到了 tinyscrollbar 的问题，在第一页加载时，视口(viewport)中的所有内容并未显示(您可以在此处查看问题:pnsilva.net)。

下面是我创建滚动条和加载内容的方式:

$(window).load(function(){

    $('#scrollbar1').tinyscrollbar();
    $("#scrollbar1 .viewport .overview p").load("/favorites", function() {
        $('#scrollbar1').tinyscrollbar_update();    
    });

    $('#scrollbar2').tinyscrollbar();
    $("#scrollbar2 .viewport .overview p").load("/books", function() {
        $('#scrollbar2').tinyscrollbar_update();
    });

    $('#scrollbar3').tinyscrollbar();
    $("#scrollbar3 .viewport .overview p").load("/music", function() {
        $('#scrollbar3').tinyscrollbar_update();
    });

    $('#scrollbar4').tinyscrollbar();
    $("#scrollbar4 .viewport .overview p").load("/photos", function() {
        $('#scrollbar4').tinyscrollbar_update();
    });

    $('#scrollbar5').tinyscrollbar();
    $("#scrollbar5 .viewport .overview p").load("/code", function() {
        $('#scrollbar5').tinyscrollbar_update();
    });

});

这是 css 的样子:

#scrollbar1 { float:left; width: 20%; height:100%; }
#scrollbar1 .viewport { width:97%; height: 100%; overflow: hidden; }
#scrollbar1 .overview { position: relative; float:left; left: 10px; right:5px; top: 0; color:#fff; font-family:Verdana, Geneva, sans-serif; font-size:13px; line-height:20px; }
#scrollbar1 .thumb { background-color: #2D8CDA; width:2px; }
#scrollbar1 .scrollbar { position: relative; float: right; width: 2px; }
#scrollbar1 .track { background-color: #D8EEFD; height: 100%; width:2px; position: relative; }
#scrollbar1 .thumb { height: 20px; width: 2px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#scrollbar1 .disable{ display: none; }

知道为什么会发生这种情况吗？

谢谢

Answer 1

你应该给你的图片一个宽度和高度