Microsoft Edge范围输入拇指不可单击

问题描述

我在这里输入了简单的范围：

<style>

.slider {
  -webkit-appearance: none;
  width: 500px;
  height: 15px;
  background: #d3d3d3;
  outline: none;
  border-radius: 10px;
  pointer-events: none;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: #4CAF50;
  cursor: pointer;
  pointer-events: all;
}

.slider::-moz-range-thumb {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: #4CAF50;
  cursor: pointer;
  pointer-events: all;
}
</style>


<input class="slider" type="range" min="1" max="1000" value="300">

我希望整个轨道不能被单击，而只能是拇指（因此您不能单击轨道，只能拖动拇指）。因此，我在输入上设置了pointer-events: none;，在拇指上设置了pointer-events: all;，但这不适用于Microsoft Edge。我该如何运作？

P.S。我尝试了::-ms-thumb，但没有任何效果。边缘版本是44。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

html microsoft-edge webkit