Ion.RangeSlider颜色来自中间

Question

我正在尝试使用Ion.RangeSlider创建一个滑块，其中颜色从中心开始，然后沿滑块控件的方向移动，直到它到达滑块控件。现在，这就是我所拥有的：

相反，我希望颜色从滑块的中心到滑块控件。

如何让RangeSlider像这样工作，使颜色从中间开始（如上图所示）？

编辑：

我查看了this question，但它处理的滑块有两个控件而不是一个。

编辑1：

setup.js ：

jQuery(document).ready(function($){

     $(".slider").each(function() {

        console.log($(this).attr("id"));
        $(this).ionRangeSlider({
            type: $(this).attr("data-slider_type"),
            grid: $(this).attr("data-slider_grid"),
            min:  $(this).attr("data-slider_min"),
            max:  $(this).attr("data-slider_max"),
            prefix: $(this).attr("data-slider_prefix")+" ",
            postfix: " " + $(this).attr("data-slider_suffix"),
            step: $(this).attr("data-slider_stepper"),
            from:  $(this).attr("data-slider_from")
        });

        $(this).on("change", function () {
            var $this = $(this),
                value = $this.prop("value").split(";");
        });
    });

});

Answer 1

使用：https://github.com/jordansoltman/ion.rangeSlider with有另外的布尔选项：fixMiddle。例如：

$(".slider").ionRangeSlider({
    fixMiddle: true,
    ...
});

注意：使用ion.rangeSlider.js作为ion.rangeSlider.min.js尚未更新。