水平JQueryのUIスライダー

Question

私は次のように同じで水平にしたいと思います。私は方向を水平に変更しようとしました、そしてそれを完全にそのままにして、デフォルトに水平にしましたが、色はオレンジ色にデフォルト設定されていました。私はASP.NETを使用しています。

Vertical slider, in which the filled bar change colour depending on how large the selected value gets

Answer 1

私はそれはあなたが100％

欲しいものを理解することは少し難しい感じが、私はあなたのために水平それを作成しました。

Fiddle

Fiddle with Orange color

$(function() { 

$("#slider-vertical").slider({ 
    orientation: "Horizontal", 
    range: "min", 
    min: 0, 
    max: 100, 
    value: 60, 
    slide: function(event, ui) { 
     $("#amount").val(ui.value); 
     var g = parseInt(ui.value <= 50 ? 255 : 255 - ((ui.value-50)*(255/50))); 
     var r = parseInt(ui.value >= 50 ? 255 : 255 - ((50-ui.value)*(255/50))); 
     $(".ui-widget-header").css("background-color", "rgb("+r+","+g+",0)"); 
    } 
}); 
$("#amount").val($("#slider-vertical").slider("value")); 
});