Jquery Slider：如何獲得最小和最大圖標？

請任何人可以幫助我與jQuery的滑塊範圍？我是jQuery的新手，並試圖在拖動左/右範圍中實現min（右箭頭圖標）和max（左箭頭圖標）。Jquery Slider：如何獲得最小和最大圖標？

價格範圍：0 - 1000 == （>） ======== （<） ===

我想用我的個人形象右更換這些圖標並向左箭頭。可能嗎？

我也附上了圖像。

$(function() { 
    var values = [0,25,50,100,200,400,700,1000]; 
    $("#slider-range").slider({ 
     range: true, 
     min: 0, 
     max: 1000, 
     step:50, 
     orientation: "horizontal", 
     values: [ 0,1000 ], 
     slide: function(event, ui) { 
      $("#amount").val("£" + ui.values[ 0 ] + " - £" + ui.values[ 1 ]); 
      console.log("From: "+ui.values[0],"To: "+ui.values[1]); 
      $("#min").val(ui.values[ 0 ]); 
    $("#max").val(ui.values[ 1 ]); 
     } 
    }); 
    $("#amount") 
    .val("£" + $("#slider-range") 
    .slider("values", 0) + " - £" + $("#slider-range") 
    .slider("values", 1)); 
}); 
$("#slider-range a").hide();

來源

2012-08-06 Sappy

在快速查看標記之後，看起來jQuery-UI並沒有區分這兩個滑塊。這不是一個大問題;我建議在構建滑塊時做的事情是相應地將min-value和max-value添加到ui-slider-handle。這樣的事情應該做的伎倆：

$('#slider-range').slider({ 
    range: true, 
    min: 0, 
    max: 1000, 
    step:50, 
    orientation: "horizontal", 
    values: [ 0,1000 ], 
    slide: function(event, ui) { 
      $('#amount').val("£" + ui.values[ 0 ] + " - £" + ui.values[ 1 ]); 
      $('#min').val(ui.values[ 0 ]); 
      $('#max').val(ui.values[ 1 ]); 
    } 
}).find('.ui-slider-handle') 
    .eq(0).addClass('min-slider').end() 
    .eq(1).addClass('max-slider');

這些類的地方，然後你可以設置的CSS，對其進行定位和操縱他們如何看你的願望。 :)

來源

2012-08-06 14:46:35 Richard

這就是輝煌！它的工作，謝謝:-) – Sappy 2012-08-06 14:55:51

滑塊手柄可以由類別ui-slider-handle識別。你可以嘗試把一個background-image那些使用CSS：

#my-slider .ui-slider-handle { background-image: url(min.png); }

您可能需要設置其他background-*屬性得到的東西正常工作。

在第二個滑塊（在HTML第一個之後出現）上放置不同的背景圖像作爲海報練習。

來源

2012-08-06 14:41:10

Jquery Slider：如何獲得最小和最大圖標？

回答

相關問題