âš ī¸ Warning âš ī¸ Deprecated Code! This video tutorial contains outdated code.
💡 If you wish to update it, any AI assistant will update the code for you in seconds.

Slider Tutorial Javascript Function Programming

Published : November 15, 2014   •   Last Edited : November 24, 2025   •   Author : Adam Khoury
Learn to program HTML sliders using JavaScript to spruce up the user interfacing in your web site applications and programs.
<!DOCTYPE html>
<html>
<head>
<script>
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>