https://teamex.in/assets/purchase/js/slider-range.js?v=1790258576

1 const rangeInput = document.querySelectorAll(".range-input input"),
2  priceInput = document.querySelectorAll(".price-input input"),
3  range = document.querySelector(".slider .progress");
4let priceGap = 1;
5
6priceInput.forEach((input) => {
7  input.addEventListener("input", (e) => {
8    let minPrice = parseInt(priceInput[0].value),
9      maxPrice = parseInt(priceInput[1].value);
10
11    if (maxPrice - minPrice >= priceGap && maxPrice <= rangeInput[1].max) {
12      if (e.target.className === "input-min") {
13        rangeInput[0].value = minPrice;
14        range.style.left = (minPrice / rangeInput[0].max) * 100 + "%";
15      } else {
16        rangeInput[1].value = maxPrice;
17        range.style.right = 100 - (maxPrice / rangeInput[1].max) * 100 + "%";
18      }
19    }
20  });
21});
22
23rangeInput.forEach((input) => {
24  input.addEventListener("input", (e) => {
25    let minVal = parseInt(rangeInput[0].value),
26      maxVal = parseInt(rangeInput[1].value);
27
28    if (maxVal - minVal < priceGap) {
29      if (e.target.className === "range-min") {
30        rangeInput[0].value = maxVal - priceGap;
31      } else {
32        rangeInput[1].value = minVal + priceGap;
33      }
34    } else {
35      priceInput[0].value = minVal;
36      priceInput[1].value = maxVal;
37      range.style.left = (minVal / rangeInput[0].max) * 100 + "%";
38      range.style.right = 100 - (maxVal / rangeInput[1].max) * 100 + "%";
39    }
40  });
41});
42;