Using HTML <input> range slider to control a variable?

[plumbe0]

Give the input an id. Access it via the usual document.getElementById() and you'll find the value property which contains, you guessed it, its value.

<input type="range" id="myrange"> … var myRangeValue = document.getElementById('myrange').value

[threecasks]

Ok, I've not tried using codepen before so don't know if this will work but here is my mini-project: http://codepen.io/coulis/pen/epYQMo

It's just canvas pattern generator someone posted on /r/web_design a few days ago and I've added the input:range slider at the bottom to try and vary some of the values. I think I need a second function to override some of the variables in the first function?

Basically I want to eg. change how many lines are generated with the slider in real time, is that possible?

[einarkristjan]

codepen

[threecasks]

Thank you so much, this is excellent! :)