2012-08-15 35 views
1

我使用Script.aculo.us Slider.js來顯示雙滑塊。它工作正常。 我想要做的就是改變顏色只在這兩個滑塊之間跟蹤。2滑塊漢德爾之間改變曲目顏色

例如,如果第一個滑塊的值爲5,第二個值爲8.我希望5-8的軌道是綠色,其餘是灰色的。模擬選定範圍的國王。

可能嗎?

回答

2

我已經想通了,可以通過使用2個選項屬性 startSpan和endSpan。

或許是爲了別人我在這裏粘貼示例HTML snippt和JavaScript

<div id="slider-week-track"> 
    <div id="span1" style="float:left;background-color: #B7C0CD; height: 11px;"></div> 
    <div class="slider-week slider-min" id="slider-week-min-handle"></div> 
    <div class="slider-week slider-max" id="slider-week-max-handle"></div> 
    <div id="span2" style="float:right;background-color: #B7C0CD; height: 11px;"></div> 
</div> 

和JavaScript有用

new Control.Slider(this.options.handles, 'slider-week-track', { 
         range:$R(0,10, false), 
         sliderValue: [1,5], 
         values: [0,1,2,3,4,5,6,7,8,9,10], 
         restricted: true, 
         startSpan: 'span1', 
         endSpan: 'span2', 
         onChange: function(val) { 
          //your code here 
         } 
     });