jquery-Slider

Ref: https://jqueryui.com/slider/#range
包含多個jquery套件
可以參考內容去更改
以下只以range slider作為範例

1. 在html中加入link:

<link href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"></link>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

2. 在html裡加一個id=slider-range的div

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

3. 在script裡initial bar:

$(function() {
    $("#slider-range").slider({
      range: true,
      min: 0,
      max: 500,
      values: [ 75, 300 ],
      slide: function( event, ui ) {
        // do somethong when value change
        // ui.values[0]: left value
        // ui.values[1]: right value
      }
    });