Question

CSS

/* Tiny Scrollbar */
#scrollbar1 { width: 559px; margin: 20px 0 10px; clear: both;}
#scrollbar1 .viewport { width: 500px; height: 1050px; overflow: hidden; position: relative; }
#scrollbar1 .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 0; margin: 0; }
#scrollbar1 .scrollbar{ background: transparent url(images/bg-scrollbar-track-y.png) no-repeat 0 0; position: relative; background-position: 0 0; float: right; width: 11px; }
#scrollbar1 .track { background: transparent url(images/bg-scrollbar-trackend-y.png) no-repeat 0 100%; height: 100%; width:9px; position: relative; padding: 0 1px; }
#scrollbar1 .thumb { background: transparent url(images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; height: 20px; width: 20px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: -5px; }
#scrollbar1 .thumb .end { background: transparent url(images/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow: hidden; height: 5px; width: 20px; }
#scrollbar1 .disable { display: none; }

当我将.viewport设置为超过700px时，滚动条不会显示。我不明白。

PS。我没有发布代码，因为我正在使用直接来自演示，但以防万一：

    $(document).ready(function(){
        $('#scrollbar1').tinyscrollbar({ size: 360 });; 
    });

好的，我刚尝试了另一个滚动jscrollpane，同样的事情发生了。这是site所以你可以看到我想要做的事情。现在它没有显示其余的内容，如果我将其更改为1050px，它将会滚动消失。

如果有更多代码可以让我知道我不知道还有什么可以做这件事，我就陷入了困境。

Answer 1

使用图像设置图像的高度和宽度。滚动条无法正确计算视口的度量标准，因为初始化时图像仍在加载。

将高度设置为视口时，微小的滚动条消失了

1 个答案: