Javascript 剑道UI拆分器：在拆分器窗格调整大小时更改拆分器颜色

我最近开始与KendoUI Splitter合作

我有一个白色背景，当我移动拆分控制柄调整窗格大小时，显示窗格大小调整位置的拆分控制柄将出现。问题是，因为页面背景是白色的，我几乎看不到这个控制柄，所以我想将其颜色更改为更可见的颜色

HTML:

---

这是JSFiddle中的最新版本。我想在分割条移动时更改分割条的颜色。

调整分割条大小时，会为“移动分割条”添加一个新元素。 此元素的类为

.k-ghost-splitbar

，因此可以向该元素添加自定义背景色

.k-ghost-splitbar {
    background-color: red;
}

---

我已经更新了你的。

Tnx很多我一直在找这个

$("#vertical").kendoSplitter({
    orientation: "vertical",
    panes: [
        { collapsible: false, resizable: false, size: "100px" },
        { collapsible: false },
        { collapsible: false, resizable: false, size: "100px" }
    ]
});

$("#horizontal").kendoSplitter({
    panes: [
       { collapsible: true },
       { collapsible: false },
       { collapsible: true }
    ]
});

$(window).resize(function() {
   resizeSplitter()
});

resizeSplitter = function() {
   splitter = $("#vertical")
    .data("kendoSplitter")
    .size("#middlePane", $(window).height() - 200 + "px")
    .trigger("resize")
};

resizeSplitter();

.k-ghost-splitbar {
    background-color: red;
}