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：如何获得最小和最大图标？

回答

相关问题