HTML / JS: превратить регулятор диапазона в ввод числа и обратно

Question

С HTML / JS я бы хотел создать элемент управления пользовательским интерфейсом для подстройки чисел.

Требования

Я бы хотел поддержать схему грубых и точных т. е. повторно использовать пространство элемента управления диапазоном для ввода числа, чтобы рабочий процесс для настройки числа выглядел так:

• Перетащите ползунок, чтобы войти в грубую зону;
• Дважды щелкните ползунок и увидите элемент управления вводом на месте, пока диапазон становится невидимым;
• Введите точное число;
• Нажмите Escape на клавиатуре и снова увидите регулятор диапазона и ввод становится невидимым.

Возможно ли это? Если это так, мне нужно несколько указателей, как это сделать. Будет ли это наложение или удаление / добавление / обновление sh циклов? Я, честно говоря, понятия не имею, как.

Answer 1

Это должно быть возможно путем непосредственной установки value регулятора диапазона.

Это может быть так же просто, как прослушивание событий мыши на слайдере, подключение к одному из них, отображение модального режима, в котором один вход предварительно заполнен существующим значением на слайдере, что позволяет пользователю напрямую изменять значение ,

После «отправки» этого модального обновления значение ползунка, т.е. document.getElementById("slider").value = 123;