javascript - 多滑块控制器

Question

我正在尝试用 javascript 构建这个控制器，但我无法启动，因为我在搜索时没有得到我想要的东西（我已经搜索了滑块或音量滑块或多滑块，但我需要的东西没有显示）。

解释;

• 有 25 个压力控制器（应用程序将从 2 个开始，但随后每个级别/阶段的数量会增加）
• 所有滑块都有一个共同的 MAX 和 MIN（现在假设为 0 和 100）
• 每个滑块都有一个条，然后有一个 MIN（绿色三角形）、MAX（红色三角形）和一个实际（黄色三角形）
• 用户可以移动 3 个点中的每一个（将其值发送到控制器之外）
• 滑块的 MIN 和 MAX 不能超过实际值。
• 尽管这听起来很愚蠢，但 MIN 和 MAX 可能与实际值相同。
• 前一个管道的 MIN 不能低于下一个管道的 MIN
• 同样注意，下一个管道的 MAX 不能低于前一个管道的 MAX
• 这些数字需要从控制器发送出去。

我没有太多 javascript 经验，但到目前为止，我有一个带有 1 个可移动手柄的水平滑块（不是我想要的三角形，但它是一个开始）。

我认为我的第一步是以某种方式使其垂直，并为 MIN 和 MAX 再放置 2 个控制点，复制代码以制作更多滑块，然后以某种方式在幻灯片上放置验证。

关于如何从这里开始的任何帮助都会很棒。我宁愿不使用库，因为我们在使用它们时会遇到问题（不确定它们是否在这里被阻止）。

标签： javascriptcss