Disable track click on input type range

Admin 1
Viewed 1352

I want to disable track click on input type range, Only allow drag through thumb.

I am able to do it in all browsers except Microsoft Edge and Internet Explorer.

I am doing this way 

#slider {
  display: block;
  width: 400px;
  height: 40px;
  margin: 0px auto;
  padding: 5px 10px;
  z-index: 20;
  border-radius: 20px;
  pointer-events: none;
}

#slider::-moz-range-thumb {
  pointer-events: auto !important;
}

#slider::-webkit-slider-thumb {
  pointer-events: auto !important;
}

#slider::-ms-thumb {
  pointer-events: auto !important;
}

#slider::-ms-track {
  pointer-events: none !important;
}
<input id="slider" type="range" value="0" min="0" max="100" autocomplete="off" />

Please see why its not working on Microsoft Edge and Internet Explorer and suggest any possible way to do it.

Thanks

css html
1 Answers

using jquery to disable

$("input[name=Range]").css("pointer-events","none"); $("input[name=Range]").css("disabled","disabled");

to normal

$("input[name=Range]").css("pointer-events","auto"); $("input[name=amountRange]").removeAttr("disabled");

user_74391860
Related