Javascript Ion.RangeSlaider颜色从中间开始

我试图使用

Ion.RangeSlider

制作一个滑块，其中颜色从中心开始，沿着滑块控制的方向移动，直到它碰到滑块控制。现在，这就是我所拥有的：

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

如何使

范围滑块

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

编辑： 我看了一下，但它处理的是两个控件的滑块，而不是一个

编辑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(";");
        });
    });

});

Use:with具有附加的布尔选项：fixmidle。例如：

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

---

注意：使用ion.RangeSloider.js，因为ion.RangeSloider.min.js尚未更新。

您能提供代码吗？@JordanS我正在使用WordPress重力表单插件的特殊字段扩展。它在生成滑块时自动使用

Ion.RangeSlider

。我想更改默认的滑块着色行为。如果有帮助的话，我已经包含了创建滑块的

setup.js

文件。是我制作的一个fork，它添加了一个额外的布尔选项“fixmidle”，这是您正在寻找的行为。请注意，我没有缩小我的更改，因此您必须使用ion.rangeSlider.js或自己缩小它。我所做的所有更改都在这里：。感谢您更改JS以支持这一点！我用了你的新版本，它工作得很好。你能将PR提交回主回购协议，以便将其合并到RangeSloider的下一个版本中吗？我不确定这是一个足够普遍的用例，他们会接受它，但我可以尝试。虽然更改效果很好，但我遇到了一个问题。希望你能帮忙。如果用户转到多页表单的下一页，然后单击“上一页”按钮返回滑块页面->他们输入的滑块值丢失。滑块返回到中间值。我怎样才能解决这个问题？谢谢