Learn to program HTML5 sliders using Javascript to spruce up the user interfacing in your applications and programs. The HTML5 INPUT tag has much more power in many ways than it had before.
Lesson Code
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function sliderChange(val) {
// Use Ajax post to send the adjusted value to PHP or MySQL storage
document.getElementById('sliderStatus').innerHTML = val;
}
</script>
</head>
<body>
<h2>HTML5 + Javascript Slider Tutorial and Example Script</h2>
<input type="range" min="0" max="100" value="50" step="2" onChange="sliderChange(this.value)" />
<br /><br />
Slider Value = <span id="sliderStatus">50</span>
</body>
</html>
0 comments:
Post a Comment