JSFiddle - React, Tailwind, and code Playground

by toby3105

HTML

<div style="margin-top: 1em">
    <h2>Price</h2>
    $51<input id="price" type="range" min="51" max="360" value="" />$360
</div>

<p id="result"></p>

JavaScript

/* oninput event handler (and input event handler event types) on html5 input[type="range"] 
   by @girlie_mac

In this example, both "change" and "input" behave the same.

See another example at http://jsfiddle.net/girlie_mac/CcqU7/

*/

var p = document.getElementById("price"),
    res = document.getElementById("result");

p.addEventListener("input", function() {
    res.innerHTML = "$" + p.value;
}, false); 

document.body.addEventListener('touchmove', function (event) {
	event.preventDefault();
 });