火狐 - 定製滾動條

Question

我有以下的代碼，自定義WebKit的滾動條....

/*webkit scroll bar*/ 

::-webkit-scrollbar { 
    width: 6px; 
} 


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


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

我想要做的是定製在Firefox加載同樣的方式在頁面的滾動條。 ..對於我嘗試下面的代碼..

/*mozilla scroll bar*/ 

::-moz-scrollbar { 
    width: 6px; 
} 


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


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

，但它不工作.....我怎麼可以自定義以同樣的方式我做了WebKit的滾動條...任何幫助，將不勝感激...預先感謝... :)

Answer 1

你不能因爲bug #77790（鏈接1）。

錯誤77790 - （滾動條的顏色）的樣式滾動條（結合:: - MOZ-水平滾動條XBL）\

的唯一方法是使用jQuery。我不知道如何編碼，所以不要問我。我爲jQuery滾動條準備了以下鏈接。 Click here!（鏈接2）

鏈接：

• https://bugzilla.mozilla.org/show_bug.cgi?id=77790
• http://plugins.jquery.com/custom-scrollbar/

Answer 2

試試這個曾經

用於Firefox - 自定義滾動條

@-moz-document url-prefix(http://),url-prefix(https://) { 

scrollbar { 
    -moz-appearance: none !important; 
    background: rgb(0,255,0) !important; 
} 
thumb,scrollbarbutton { 
    -moz-appearance: none !important; 
    background-color: rgb(0,0,255) !important; 
} 

thumb:hover,scrollbarbutton:hover { 
    -moz-appearance: none !important; 
    background-color: rgb(255,0,0) !important; 
} 

scrollbarbutton { 
    display: none !important; 
} 

scrollbar[orient="vertical"] { 
    min-width: 15px !important; 
} 
}