如何改变样式jscrollpane EasyUI

时间:2015-09-19 03:38:01

标签: css jscrollpane jeasyui

我正在使用EasyUI Frozen Columns for DataGrid,所以如何更改jscrollpane样式,正在尝试:

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

但这不起作用。

1 个答案:

答案 0 :(得分:2)

一个解决方案是将数据网格保留在div并添加一个样式.scrollpane现在应用css,如下所示:

对于Chrome:

div.scroll-pane::-webkit-scrollbar {
    width: 12px;
}


/* Track */
div.scroll-pane::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

/* Handle */
div.scroll-pane::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(255, 156, 0, 0.89); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}


div.scroll-pane::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255, 156, 0, 0.44); 
}
使用jsscrollpane

对于FireFox

 $(document).ready(function () {
            var FIREFOX = /Firefox/i.test(navigator.userAgent); 
            if (FIREFOX) {
                $('.scroll-pane').jScrollPane();
            }

        });