问题标签 [round-slider]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
395 浏览

javascript - 带有文本和不同颜色的圆形范围滑块

我想做一个有 4 种不同颜色的圆形滑块,基本上,圆形滑块应该是四部分,每个部分代表 25% 不同的颜色,当有人触发 25% 时,滑块颜色应该改变,它在文本中的值应该也可以更改,例如如果第一部分背景颜色为红色,则其文本为 name1,第二部分背景颜色应为绿色,其文本为 name2,第三和第四部分也应具有不同的颜色和文本。在此处输入图像描述

作为参考,请看图片,我想实现与附图中相同的功能,你能帮忙,我该如何开发它?

0 投票
1 回答
132 浏览

javascript - 当滑块值低于 64 时,圆形滑块保持像素剩余

我的滑块代码运行良好,除了当值低于 64 时模糊绘制不必要的像素。

如何去除这些褪色的宠儿?

提前致谢。

0 投票
2 回答
94 浏览

javascript - 如何将 .roundSlider() 应用于 Array 的所有元素?

一个元素没问题,但是这里抛出错误“el.roundSlider 不是函数”,Jquery 在主 js 文件之前连接,与 Jquery .each 相同

0 投票
1 回答
88 浏览

javascript - 如何使用 .roundSlider() 在每个元素下方显示当前值?

当我更改一个滑块中的值时,它会同时更新,我该如何解决?顺便说一句,我想从具有当前数组索引的元素中获取值并使用它,这可能吗,还是存在更好的解决方案?

0 投票
1 回答
78 浏览

javascript - 圆形滑块上的三个点

我试图找出在圆形滑块上添加不是两个而是三个点/句柄的方法(此处: https ://roundsliderui.com/document.html#options )

根据文档,可能的句柄数量由sliderType选项定义,该选项可以是defaultormin-rangerange - 最后一个定义了两个句柄而不是一个。

欢迎任何建议如何处理(双关语不是故意的)。

0 投票
2 回答
63 浏览

javascript - 如何填充圆形范围滑块内的背景颜色?以及如何增加工具提示的字体大小?

这是我的代码:HTML:

CSS:

我似乎无法填充曲线内部的颜色。谁能帮我解决这个问题?提前致谢!

0 投票
2 回答
161 浏览

javascript - 如何将圆形滑块的值存储在变量中并在控制台中显示?

我已经为下面提到的圆形滑块编写了代码。我无法弄清楚如何将滑块的值存储在变量中并使用 javascript 在控制台中显示它。我想将工具提示的值存储在一个变量中并将其显示在控制台中,以便它可以用于其他功能。

0 投票
1 回答
47 浏览

javascript - 根据值更改圆形滑块颜色

当人们将滑块从 100 移动到 0 时,我试图让范围颜色从绿色变为红色。我使用 JS 圆形滑块(https://roundsliderui.com/document.html)。

MRE 在这里:https ://codepen.io/chapkovski/pen/gORmrbR 但它看起来像这样:

我究竟做错了什么?