Wie füge ich einen Marker zu einem jQuery UI Slider hinzu?

Question

Ich habe einen einfachen jQuery UI-Schieberegler, der einen numerischen Bereich von 25 bis 35 hat. Es funktioniert gut und der Standardwert ist 28. Ich hoffe, dem Schieberegler ein einfaches Häkchen hinzuzufügen, um anzuzeigen, dass 28 der Standardwert ist ist. Gibt es eine einfache Möglichkeit, einen Indikator hinzuzufügen?

$('#cycle_length').slider({ 
    range: "min", 
    value: 28, 
    min: 25, 
    max: 35, 
    step: 1, 
    slide: function(event, ui) { 
    $("#amount").val(ui.value); 
    } 
}); 
$("#amount").val($("#cycle_length").slider("value")); 

Answer 1

fand ich eine große Implementierung des Gleiters jQuery UI hier:

http://www.filamentgroup.com/lab/update_jquery_ui_slider_from_a_select_element_now_with_aria_support/

Es ist das selectToSlider Plugin genannt und ermöglicht die Platzierung von Strichmarkierungen während des Schiebers sowie die Fähigkeit, Füge Labels und Tooltips hinzu.

Answer 2

Check-out die Umsetzung auf: http://jsbin.com/iwime

Das Prinzip ist ganz einfach, Sie Ihre Ticks angeben und sie dann in Schritten innerhalb des Schiebers platzieren, um die Position in% spezifizieren, wenn Sie also 10 Ticks hatte, Sie würden sie bei 0%, 10%, 20%, 30% ... setzen. 90%

Sie können die Liste der Ticks auch automatisch von den Min- und Max-Werten generieren, wobei Sie wissen, in welchem ​​Intervall die Ticks stehen sollen.