Sie sind ein jQuery-UI Slider verwenden, mit einem angepassten Rückruf, der die kleinen Knoten Boxen Highlights:
$('#slider').slider({
range: "max",
min: 1,
max: 15,
step: 1,
slide: function(event, ui) {
// Un-highlight nodes
$('.node').removeClass('highlight');
// Highlight all nodes up to value selected
$('.node:lt('+ui.value+')').addClass("highlight");
}
});
Dies ist mein Beispiel Code, ich wollte nicht durch ihren verschleierten Code analysieren, um zu sehen, was sie eigentlich für ihren Rückruf getan haben. Dem ist wahrscheinlich sehr ähnlich.
Demo: http://jsfiddle.net/jtbowden/A8ccw/1/
Sie können von dem Schritt Verhalten loszuwerden, wenn Sie den step
Wert auf einen Bruchwert zu ändern, wie .01
und dann Math.floor()
mit Ihrem Highlight Index zu bestimmen.
Demo: http://jsfiddle.net/jtbowden/A8ccw/4/
Hier ist eine Demo, die mehrere Datenfelder aktualisiert:
Demo: http://jsfiddle.net/jtbowden/A8ccw/8/
jQuery UI Slider hat, dass grundlegende Funktionen: http : //jqueryui.com/demos/slider/#steps –