jQuery UI滑块-在句柄之间添加颜色

我正在研究这个滑块，试图找出如何在控制柄之间添加颜色以突出显示范围

$("#slider").slider({
        min: 0,
        max: 2000,
        step: 1,
        values: [100, 1900],
        slide: function(event, ui) {
            for (var i = 0; i < ui.values.length; ++i) {
                $("input.slidervalue[data-index=" + i + "]").val('$'+ui.values[i]);
            }
        }
    });
    $("input.slidervalue").change(function() {
        var $this = $(this);
        $("#slider").slider("values", $this.data("index"), $this.val());
    });

$（“#滑块”）.滑块({
分:0,，
最高：2000，
步骤：1，
数值：[1001900]，
幻灯片：功能（事件、用户界面）{
对于（变量i=0；i

像这样：

---

我认为这是不可能的，因为整个条都是一个元素可能是@JulienGrégoire的重复，我也看到了这个元素，我似乎无法剖析jQuery来复制效果，这对语言来说还是新的（@patrick整个jsfiddle有点复杂，但是你可以复制粘贴你的代码中的答案，它会工作。你在你的滑块中添加3个div，设置css，设置一个函数，根据句柄位置改变这些div的大小，并在幻灯片事件中调用该函数。请参阅@JulienGrégoire-谢谢，这很有意义。我非常感谢过程中的评论，以及，这有助于我了解发生了什么！