Search code examples
jquery-uijquery-pluginsjquery-slider

How to set a parameter (width) in jQuery Slider plugin

I am using this jQuery Slider plugin , i have to set a width like setting from,to in this plugin i was totally stuck in this one please help me to overcome this issues

Solution

  • The slider take the width of parent node. So place the input in a container with desired width

    <div class="span8">
     <input id="SliderSingle" type="slider" name="price" value="20" />
</div>

    CSS

    .span8 {
      width:500px;
}

    EDIT If you want customize the source you should add at line 154

    settings: {
  from: 1,
  to: 10,
  step: 1,
  smooth: true,
  limits: true,
  round: 0,
  format: { format: "#,##0.##" },
  value: "5;7",
  width: '100%', // add this line
  dimension: ""
},

    and in line 237

    this.domNode.css('width', this.OPTIONS.settings.width);
this.inputNode.after( this.domNode );

    (untested)