Javascript 在ExtJs中更改滚动条

我正在使用ExtJs并尝试更改默认滚动条（用于网格面板）的外观

我尝试过使用jScrollPane，但它在ExtJs中根本不起作用

是否有任何方法可以更改ExtJS中滚动条的默认外观。我不想让自己看起来像jScrollPane

---

谢谢

我设法将jscrollpane与extjsgridpanel一起使用

在网格面板的render listener中，我将

$(function(){
    $('.x-grid3-scroller').jScrollPane();
});

---

我在寻找在extjs4.0.7网格上实现jScrollPane时偶然发现了这篇文章

我找不到其他合适的方法，现在我有了一种可怕的方法：

将此应用于网格配置

滚动：false

这将应用于网格的viewModel

style: {
    overflow: 'auto',
    'overflow-x': 'hidden'
}

以便关闭内部滚动

将此功能应用于扩展Ext.grid.Panel的网格

reapplyScrollbar: function () {
    var items = $('#' + this.id + ' .x-grid-view');
    var broken = $('#' + this.id + ' .jScrollPaneContainer:not(:first-child)');
    var unbroken = $('#' + this.id + ' .jScrollPaneContainer:first-child');
    console.log('unbroken count=' + unbroken.length);
    console.log('removing ' + broken.length + ' broken containers');
    broken.remove();

    // grid resized so scroller must be removed
    if (items.parent().is('.jScrollPaneContainer') && items[0].parentNode.clientHeight != items[0].clientHeight) {
        console.log('moving el up to grid body');
        var container = items.parent();
        var gridBody = items.parent().parent();
        gridBody.append(items);
        container.remove();

        if (items[0].parentNode.clientHeight != items[0].clientHeight || items[0].parentNode.clientWidth != items[0].clientWidth) {
            items[0].style.height = items[0].parentNode.clientHeight + 'px';
            items[0].style.width = items[0].parentNode.clientWidth + 'px';
            console.log('moved el and reset height & width');
        }

    } else if (items.length > 0 && items[0].clientHeight > 0 && unbroken.length == 0) {
        if (items[0].parentNode.clientHeight != items[0].clientHeight) {
            items[0].style.height = items[0].parentNode.clientHeight + 'px';
            items[0].style.width = items[0].parentNode.clientWidth + 'px';
            console.log('reset height & width');
        }

        console.log('applying scroll');
        items.jScrollPane();
        items[0].style.top = "";
    }
}

一般的想法是，布局被调用的次数太多，无法知道内部发生了什么，所以我们将检查网格视图的状态。如果网格视图与其容器的高度不同，则需要重新应用jScrollPane（并删除旧的）。内部发生了一些事情，这意味着

jScrollPane

s成为孤立的，所以我们删除孤立的

添加和删除存储记录时，我也会调用

重新分析crollbar

---

当然，虽然这是有效的，但它是非常令人讨厌的。最后，我将通过更改呈现的标记来进行更深入的操作。

看看这个www.sencha.com/forum/showthread.php？56199到ExtJS面板的滚动条您可以更具体地说明调用

重新应用
函数的位置吗？我是说你把它叫做什么？多少次？