Demo of changing slider value by a textbox using JQuery



HTML

<div id="slider"></div> 
<input type=text name=t1 id=t1 size=3>

JQuery

<script>
$(document).ready(function() {
//////////////////////////
$(function() {
  $( "#slider" ).slider({value:40,min: 0,max: 100,step: 1,slide: function( event, ui ) {
        $( "#t1" ).val( ui.value );
     }
 });
 });
////////////////
$("#t1").blur(function(){
$( "#slider" ).slider({value:$('#t1').val()})
})
////////////////
})
</script>