jQuery的水平缩放/拨号/规则

Question

试图找到一个jQuery插件，将做这样的规模，但我一直没能找到任何东西。基本上，箭头将保持放置状态，您可以左右滑动规则以更改值。

有什么想法？

Answer 1

我认为只有这样，才能做到这一点是使用线性测量计（正如我在我的评论已经说明），并使用一些自定义的javascript迫使它的行为，只要你愿意，这里是一个超级基本小提琴向你展示我的意思：

https://jsfiddle.net/vb4ak4zx/4/

HTML：

<button class="testbtn"> 
CHANGE VALUE 
</button> 
<div style="height:150px"> 
    <div id="lineargauge"></div> 
</div> 

的JavaScript/jquer Ÿ

$(function() { 
      $("#lineargauge").igLinearGauge({ 
       height: "80px", 
       width: "100%", 
       value: 150, 
       minimumValue: 100, 
       maximumValue: 200, 
       ranges: [ 
        { 
         startValue: 100, endValue: 150, name: "range1" 
        }, 
        { 
         startValue: 150, endValue: 200, name: "range2" 
        } 
       ] 
      }); 
     }); 

     $(document).on("click", ".testbtn", function(){ 
     $("#lineargauge").igLinearGauge({ 
       height: "80px", 
       width: "100%", 
       value: 50, 
       minimumValue: 0, 
       maximumValue: 100, 
       ranges: [ 
        { 
         startValue: 0, endValue: 50, name: "range1" 
        }, 
        { 
         startValue: 50, endValue: 100, name: "range2" 
        } 
       ] 
      }); 
     });