gistfile1.js

$('#brightness_slider').slider( {
	min: 0,
	max: 24,
	value: 5,
	slide: function(event, ui) {
			$("#brightness_current_value").text(ui.value);
			UpdateThing();
	},
	stop: function(event, ui) {
			$("#brightness_current_value").text($('#brightness_slider').slider('value'));
			UpdateThing();
	}

});


$("#brightness_current_value").text($('#brightness_slider').slider('value'));



$('#contrast_slider').slider( {
	min: 0,
	max: 24,
	value: 5,
	slide: function(event, ui) {
			$("#contrast_current_value").text(ui.value);
			UpdateThing();
	},
	stop: function(event, ui) {
			$("#contrast_current_value").text($('#contrast_slider').slider('value'));
			UpdateThing();
	}

});


$("#contrast_current_value").text($('#contrast_slider').slider('value'));




<div id="control-panel" style="width:540px;float:left;" >
	<ul>
		<li id="brightness">
			<div class="description">
				<span class="title">Brightness</span> <span class="subtitle">adjust this... </span>
			</div><img src="images/Brightness.png">
			<div id="brightness_slider" style="width:260px; margin:15px;"></div>
			<span id="rightness_current_value">60</span>
		</li>
		<li id="contrast">
			<div class="description">
				<span class="title">Contrast</span> <span class="subtitle">contrast is great hint</span>
			</div><img src="images/contrast.png">
			<div id="contrast_slider" style="width:260px; margin:15px;"></div>
			<span id="contrast_current_value">60</span>
		</li>
	</ul>
</div>