Javascript 圆形滑块背景不透明

我正在为一个平台做问卷调查。我们想使用jQuery插件制作一个圆形滑块。有一个问题；这就是滑块现在的样子：

我想要的是一个滑动条，白色圆圈是透明的，这样你就可以看到渐变背景。但是一旦我移除白色圆圈，我就会得到：

---

我使用的jQuery插件名为

roundsliderui

。有没有办法用这个插件解决这个问题（使内圈透明）？或者是否有一个插件，其中这是一个标准的可能性？我四处寻找了一段时间，但找不到正确的答案。我没有太多的时间来编写整个程序。

有一个例子可以说明您的问题（摘自）

var fn1=$.fn.roundSlider.prototype.\u设置属性；
$.fn.roundSlider.prototype.\u setProperties=函数（）{
fn1.适用（本）；
var o=this.options，r=o.radius，d=r*2，
r1=r-（o.width/2）-此边界（真），
svgNS=”http://www.w3.org/2000/svg";
这是._环=Math.PI*（r1*2）；
var$svg=$（document.createElements（svgNS，“svg”）；
$svg.attr（{“高度”：d，“宽度”：d}）；
此.$circle=$（document.createElements（svgNS，'circle'））.attr({
“填充”：“透明”，“类”：“rs过渡”，“cx”：r，“cy”：r，“r”：r1，
“笔划宽度”：o.width，“笔划数组”：此
}).appendTo（$svg）；
此.svg\u框=$（document.createElement（“div”））.addClass（“rs转换rs svg”）.append（$svg）.css({
“高度”：d，“宽度”：d，“变换原点”：“50%50%”，
“变换”：“旋转（“+（o.startAngle+180）+”度）
}).appendTo（此.innerContainer）；
}
var fn2=$.fn.roundSlider.prototype.\u changeSliderValue；
$.fn.roundSlider.prototype.\u changeSliderValue=函数（val，deg）{
fn2.适用（本，论点）；
deg=deg-this.options.startAngle；
如果（此._范围滑块）{
此.svg_box.rsRotate（此.u handle1.angle+180）；
度=此把手2.角度-此把手1.角度；
}
var pct=（1-（度/360））*此情况；
这个.$circle.css（{strokedashcoffset:pct}）；
}
/// ### ---- ### --------------------- ### ---- ### ///
$（“#滑块”）.roundSlider({
宽度：35，
半径：115，
幻灯片类型：“范围”，
值：“20,70”，
startAngle:90
})

正文{
背景色：#ccc；
背景大小：100%；
背景重复：无重复；
}
.rs控制.rs范围颜色，
.rs控件.rs路径颜色，
.rs控件.rs背景颜色{
背景色：透明；
}
.rs控制圈{
/*在这里提及范围颜色*/
冲程：#02b4ff；
}
.rs边框，.rs句柄{
边框：2倍纯白；
}
rs手柄{
}
.rs工具提示文本{
字体大小：22px；
字体大小：粗体；
颜色：#ff0202；
}