webkit css滾動條樣式

是否有任何方法完全擺脫滾動軌道？或者使它覆蓋內容而不是推到一邊？像iOS/Lion滾動條一樣？webkit css滾動條樣式

下得到相當接近，但即使軌道是透明的，可滾動區域的內容推到與網頁背景顯示出來。

::-webkit-scrollbar { 
    width:8px; 
    height:8px; 
    -webkit-border-radius: 4px; 
} 

::-webkit-scrollbar-track, 
::-webkit-scrollbar-track-piece { 
    background-color:transparent; 
} 

::-webkit-scrollbar-thumb { 
    background-color: rgba(053, 057, 071, 0.3); 
    width: 6px; 
    height: 6px; 
    -webkit-border-radius:4px; 
}

來源

2011-08-28 nicholas

爲什麼不使用自定義的滾動條，如基於jQuery的[JScrollPane的（HTTP ：//jscrollpane.kelvinluck.com/）？如果您願意，您可以設計它的樣式以覆蓋內容。 – Artyom

我試過jScrollPane，以及一些我自己的解決方案，使用css3翻譯，CSS位置等...沒有一個像實際的滾動條一樣快。對於已經內置到瀏覽器中的東西來說，它看起來像是額外的額外開銷。如果可以使用現有的滾動條而不是一些JavaScript假的，它似乎是一個更好的主意。 – nicholas

我發現http://www.baijs.nl/tinyscrollbar/工作得很好，速度很快（根據內容對滾動的響應）並且非常容易設置。 –

嗯，我想我回答了這個一個以前，也許不是：

隱藏在身體
溢出包裹網站或任何你正在使用一個滾動的全部內容格，
Incude爲 DIV CSS屬性（溢出：滾動或溢出-γ：滾動）。

現在，您可以使用rgba（0,0,0,0.3）將軌道css設置爲任何不透明度，因爲滾動不是主體的一部分。

自定義Firefox的滾動條，如果你想嘗試另一個技巧是：

做溢出的事情，疊加滾動條（通過z-index的），用你喜歡的任何顏色的透明DIV，
將div放在整個滾動部分（可能類似position：absolute; right：0;如果您使用整個窗口的滾動）
使用pointer-events：none;在div CSS讓它變得半透明。

它會給Firefox的滾動一點顏色/紋理。（可能是比較理想的滾動強制可比性右側）我沒有試過

，但它做的，能夠

來源

2012-03-24 16:43:05 Undefined

我不確定我明白你的意思。看看這個plunk：http://plnkr.co/edit/hbBT0lehOHlD0cizHmVn?p=preview。我想要做的是獲得紅色段落，以適應所有的方式，右邊的藍色滾動拇指漂浮在他們身上。如果我可以將藍色卷軸從邊緣拉開一點，那就更好了。 – nicholas

webkit css滾動條樣式

回答

相關問題