像Twitter對話界面一樣設計內部滾動條？

Question

當您點擊推文並且與推文鏈接的會話足夠長時，可以在側面板中看到滾動條。

滾動條是如何創建和設計的？

Answer 1

他們使用::-webkit-scrollbar和相關的僞元素，其中只有工作在WebKit瀏覽器中（這很好，因爲這只是美學）。

在此看一看以瞭解更多信息：Apple-like scrollbars using CSS

我已經採取了Twitter的使用CSS，請參見：http://jsbin.com/ubasew

#doc ::-webkit-scrollbar{width:9px;height:9px;} 
#doc ::-webkit-scrollbar-button:start:decrement,#doc ::-webkit-scrollbar-button:end:increment{display:block;height:0;background-color:transparent;} 
#doc ::-webkit-scrollbar-track-piece{background-color:#FAFAFA;-webkit-border-radius:0;-webkit-border-bottom-right-radius:8px;-webkit-border-bottom-left-radius:8px;} 
#doc ::-webkit-scrollbar-thumb:vertical{height:50px;background-color:#999;-webkit-border-radius:8px;} 
#doc ::-webkit-scrollbar-thumb:horizontal{width:50px;background-color:#999;-webkit-border-radius:8px;} 

的#doc是如Twitter有它，和它的存在這樣只有#doc內的滾動條才能定製。

Answer 2

我相信他們使用的是jQuery插件或一個由自己創造的，無論哪種方式，這是類似的東西到JScrollPane的

http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html