通过使用两个输入来实现双向滑块1，手动实现双向滑块。HTML的大致结构如下2。样式转换使用两个范围类型的输入，然后修改样式。隐藏自身的滑动颜色，使叠加的显示范围可以拖拽compatible调整拖拽圈样式input[type="range"]{-webkit-appearance:none;外观：无；//隐藏滑动样式}//叠加drag[type="range"]{pointer-events:none;}[type="range"]::-webkit-slider-thumb{指针事件：自动；}[type="range"]::-moz-range-thumb{指针事件：自动；}//调整拖动圆圈样式input[type='range']::-webkit-slider-thumb{3.增加背景色在input下添加一个div作为滚动背景色，通过计算范围区间的百分比来调整背景色的区间中心计算思路为：constfrom=Math.ceil('区间最小值'/'输入最大值'*100);constto=Math.ceil('Intervalmaximum'/'inputmaximum'*100);'Backgrounddiv'[0].style.background=`linear-gradient(toright,#898dad${from}%,#5f0085${from}%,#5f0085${to}%,#898dad${to}%,#898dad)100%`;//计算区间内最大值和最小值的百分比，设置梯度4.最终效果https://codepen.io/kekelezizi...
