<div id="container">
<div class="slider_container">
<div id="slider_callout">
<asp:TextBox ID="textbox" runat="server" CssClass="slider_callout" />
<div class="slider_bar_wish">
<div id="slider1_handle" class="slider_handle"></div>
</div>
</div>
</div>
now implement jquery slider by the following scripts
in the head section of your page -
<script type="text/javascript">
function pageLoad() {
$(function () {
$("#slider_callout").hide();
$(".slider_bar_wish").slider({
handle: ".slider_handle",
minValue: 0,
maxValue: 10,
value: 0, //you can set the value
start: function (e, ui) {
$("#slider_callout").fadeIn('fast');
},
stop: function (e, ui) {
},
slide: function (e, ui) {
$(".slider_callout").val(Math.round(ui.value * (10 / 100)));
}
});
});
}
</script>
make sure you added jquery and jquery ui script declaration at first in head section.
Hope this helped you.Don't forget to like and share it.
