使滚动条始终在div中可见 - 铬合

Question

我第一次实现了无限滚动，但是当没有溢出时，我无法在最初显示滚动条。我想这在铬：

#scrollarea-invalid { 
overflow-y: scroll !important; 
height: 350px; 

}

我怎样才能使滚动总是在这个div显示，即使含量小于350像素在这个div？

Answer 1

只有滚动条可见，不会允许您对尝试向下滚动的用户做出反应。因此，您需要实际使内容在区域之外流动并检测滚动。 试试这个：

#scrollarea-invalid { 
 
overflow-y: scroll; 
 
height: 350px; 
 
} 
 
#scrollarea-content{ 
 
    min-height:101%; 
 
}

<div id='scrollarea-invalid'> 
 
    <div id='scrollarea-content'></div> 
 
</div>

Answer 2

body { 
 
    padding: 10px; 
 
} 
 

 
ul { 
 
    max-height:150px; 
 
    overflow:scroll; 
 
} 
 

 
::-webkit-scrollbar { 
 
    -webkit-appearance: none; 
 
    width: 10px; 
 
} 
 

 
::-webkit-scrollbar-thumb { 
 
    border-radius: 5px; 
 
    background-color: rgba(0,0,0,.5); 
 
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5); 
 
}

<ul> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
    <li>This is some content</li> 
 
</ul>