css - tinyscrollbar 没有出现

Question

我很困惑，我想用插件 tinyscrollbar 制作一个侧边栏，我希望视口(viewport)的“高度”是“100%”但是如果我更改 css 那么内容就不会出现，你能给我另一个吗解决方案？

这是 tinyscrollbar 的默认代码，但我更改了视口(viewport)的“高度”:

#scrollbar1 { 
width: 520px; 
margin: 20px 0 10px; }
#scrollbar1 .viewport { 
width: 500px; 
height: 100%; 
overflow: hidden; 
position: relative; }
#scrollbar1 .overview {
height:100%;
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: 15px;
height:100% }
#scrollbar1 .track { 
background: transparent url(../images/bg-scrollbar-trackend-y.png) no-repeat 0 100%; 
height: 100%;
width:13px; 
position: relative; 
padding: 0 1px; }
#scrollbar1 .thumb { 
background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; 
height: 20px; width: 25px; 
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: 25px; }
#scrollbar1 .disable { 
display: none; }
.noSelect { 
user-select: none; 
-o-user-select: none; 
-moz-user-select: none; 
-khtml-user-select: none; 
-webkit-user-select: none; }

Answer 1

你不能让它成比例(百分比)，你需要一个固定的值。使用 jQuery 或类似的东西来确定实际高度，然后将其用作固定像素高度值。这是我能提供的最好建议。此外，您可能需要对窗口大小调整使用react。