将边界半径应用于滚动条:: - webkit-scrollbar CSS3

2012-02-14 35 views 1 likes

目前不需要跨浏览器，只需webkit即可。我熟悉:: - webkit滚动条样式的能力，但我怎样才能使用这个或JavaScript来使滚动条遵守元素的边界半径？将边界半径应用于滚动条:: - webkit-scrollbar CSS3

我有一个DIV与边界半径：

#tagBox { 
    border-radius: 20px; 
} 
#tagBox::-webkit-scrollbar-??? { 
    ???: ??? 
}

如何使滚动条服从元素的边界半径？即使它需要JavaScript。（我已经尝试过LionBars插件和jScrollPane，结果是可怜的bug）

谢谢！

来源

2012-02-14 alt

回答

希望这个例子可以帮助你：http://trac.webkit.org/export/41842/trunk/LayoutTests/scrollbars/overflow-scrollbar-combinations.html

我想你错过了这些东西：

::-webkit-scrollbar { 
    width: 13px; 
    height: 13px; 
} 
::-webkit-scrollbar-track { 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px; 
} 

::-webkit-scrollbar-thumb { 
    border-radius: 10px; 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

更好地了解你可以按照这个小提琴：http://jsfiddle.net/Sfy9p/3/

来源

2012-02-14 09:37:03 Gurvinder

将边界半径应用于滚动条:: - webkit-scrollbar CSS3

回答

相关问题