CODEWITHSUNDEEP
jqueryjquery-ui
Pure Rhymer Organization
Pure Rhymer Organization

Reputation: 536

Change the position of slider according the value of input

How can change the position of slider according to what value put in input? Im run out of ideas. Any help would be appreciated.

this is my html

<h1>HTML Slider Test</h1>

<div id="slider"></div>

<p>Your slider has a value of <span id="slider-value">
<input type="text">
</span></p>

this is the script

$("#slider").slider(
    {
      value:100,
      min: 0,
      max: 500,
      step: 50,
      slide: function( event, ui ) {
        $( "#slider-value" ).val( ui.value );
      }
    }
);

$( "#slider-value input" ).val(  $('#slider').slider('value') );

this is the fiddle

Sample

Upvotes: 1

Views: 1384

Answers (1)

Miro
Miro

Reputation: 8650

Check the Docs for jQueryUI. You need to use $( ".selector" ).slider( "value", 55 );

Here's a demo

$('input').on('change keyup', function(){
    var val = $(this).val();
  $( "#slider" ).slider( "value", val );
});

You can also use just change if the keyup is too aggressive.

Upvotes: 3

Related Questions