如何創建自定義滾動條？

-1

任何人都可以讓我知道css創建一個自定義滾動條，看起來像圖像中的那個？背景應該是透明的，現在我已經把它放在綠色的背景上。如何創建自定義滾動條？

2012-02-15 Beginner

你有什麼嘗試？僅限CSS的自定義滾動條只能在WebKit中使用。另外，你爲什麼覺得有必要張貼這麼大的圖片？ – 2012-02-15 12:57:33

請嘗試谷歌？我們不是僱用的編碼員。 – Iznogood 2012-02-15 12:58:01

可能的重複http://stackoverflow.com/questions/1756281/how-to-make-a-custom-scroll-bar-with-css，http://stackoverflow.com/questions/3510741/to-change- A-滾動條造型。 – Zeta 2012-02-15 13:02:42

爲此，您可以使用jQuery插件JScrollPane中 - http://jscrollpane.kelvinluck.com/

$(function() { 
    $('.scroll-pane').jScrollPane(); 
});

設置了上述代碼帶班「上滾動窗格」一個div滾動。

你不能用標準的CSS，但與CSS3，你可以這樣做：

pre::-webkit-scrollbar { 
    height: 1.5ex; 
    -webkit-border-radius: 1ex; 
    } 

pre::-webkit-scrollbar-thumb { 
    border-top: 1px solid #fff; 
    background: #ccc -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(240, 240, 240)), to(rgb(210, 210, 210))); 
     -webkit-border-radius: 1ex; 
     -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); 
}

注意：這隻能在WebKit的瀏覽器。

來源

2012-02-15 12:59:42 SpaceBeers

如何創建自定義滾動條？

回答

相關問題