HTML5 Slider with onchange function

Question

I have a slider (input type range) that is supposed to run a function when the value is being changed. The function should then display the new value in a seperate div-conta

Answer 1

It works, you just need to make sure that the javascript function is defined when the element is rendered, f.ex.

​

See this demo: http://jsfiddle.net/Mmgxg/

A better way would be to remove the inline onchange attribute:

And then add the listener in your javascript:

var slide = document.getElementById('slide'),
    sliderDiv = document.getElementById("sliderAmount");

slide.onchange = function() {
    sliderDiv.innerHTML = this.value;
}​

​http://jsfiddle.net/PPBUJ/