<div class="range-text"</div> <section class="range-container" style="margin-left: 75px;"> <input id="MIN" class="rangeslider" value="0.2" min="0.1" max="2" step="0.1" type="range"> <input id="MAX" class="rangeslider" value="0.3" min="0.1" max="2" step="0.1" type="range"> </section>
$(document).ready(function () { let rangeText = document.getElementsByClassName('range-text')[0] let rangeContainers = Array.from(document.getElementsByClassName('range-container')); let rangeSliders = Array.from(rangeContainers.map(container => container.getElementsByTagName('input')).pop()); rangeSliders.forEach(input => { if (input.type === 'range') { input.oninput = grabValues input.oninput() } }); function grabValues() { const parent = this.parentNode, slides = Array.from(parent.getElementsByTagName('input')); let v1 = parseFloat(slides[0].value), v2 = parseFloat(slides[1].value); if (v1 >= v2) { const tmp = v2; v2 = v1; v1 = tmp; } rangeText.innerHTML = `${v1}mm${v2}mm`; } });
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)