Hier werden die Unterschiede zwischen zwei Versionen angezeigt.
Beide Seiten der vorigen RevisionVorhergehende ÜberarbeitungNächste Überarbeitung | Vorhergehende ÜberarbeitungNächste ÜberarbeitungBeide Seiten der Revision | ||
de:create:questions:slider [17.03.2018 20:53] – [Beispiel 1] admin | de:create:questions:slider [06.05.2019 17:16] – [Beispiel: Euro-Beträge] jonaden | ||
---|---|---|---|
Zeile 83: | Zeile 83: | ||
- | ==== Beispiel | + | ==== Beispiel: Euro-Beträge |
Der folgende HTML-/ | Der folgende HTML-/ | ||
Zeile 91: | Zeile 91: | ||
<!-- | <!-- | ||
formatter = function(value, | formatter = function(value, | ||
+ | value = Math.round(value); | ||
if (value < 0) return ""; | if (value < 0) return ""; | ||
return String(Math.round((value - 1) / 100 * 20)) + " €"; | return String(Math.round((value - 1) / 100 * 20)) + " €"; | ||
Zeile 108: | Zeile 109: | ||
</ | </ | ||
- | **Hinweis: | + | **Hinweis: |
**Tipp:** Der Name '' | **Tipp:** Der Name '' | ||
- | ==== Beispiel | + | ==== Beispiel: Negative Werte ==== |
Der folgende JavaScript-Code (er muss wieder wie oben von einem ''< | Der folgende JavaScript-Code (er muss wieder wie oben von einem ''< | ||
Zeile 130: | Zeile 131: | ||
- | ==== Beispiel | + | ==== Beispiel: Uhrzeit ==== |
+ | |||
+ | Um einen Zeitwert zwischen "0:00 Std." und "24:00 Std." mit einer Schrittweite von 15 Minuten anzuzeigen, muss im Schieberegler eine Differenzierung " | ||
+ | |||
+ | <code javascript> | ||
+ | <script type=" | ||
+ | <!-- | ||
+ | formatter = function(value, | ||
+ | if (value < 0) return ""; | ||
+ | // Transformation auf 0..96 | ||
+ | value = Math.round(value - 1); | ||
+ | // Stunden und Minuten durch Division/ | ||
+ | var hours = Math.floor(value / 4); | ||
+ | var minutes = Math.floor(60 * (value % 4) / 4); | ||
+ | // Die Minuten immer zweistellig anzeigen | ||
+ | if (minutes < 10) minutes = " | ||
+ | // Die Werte durch einen Doppelpunkt verbinden | ||
+ | return hours + ":" | ||
+ | } | ||
+ | SoSciSliders.setFormat(formatter); | ||
+ | // --> | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | Mit dem gleiche Code lässt sich natürlich eine Uhrzeit abfragen, es muss lediglich das " | ||
+ | |||
+ | |||
+ | ==== Beispiel: Anzeige für einzelne Schieberegler | ||
Mittels JavaScript können Sie für einzelne Schieberegler die Anzeige der Position deaktivieren. Folgender HTML-/ | Mittels JavaScript können Sie für einzelne Schieberegler die Anzeige der Position deaktivieren. Folgender HTML-/ | ||
Zeile 143: | Zeile 171: | ||
- | ==== Beispiel | + | ==== Beispiel: Positionierung des angezeigten Werts ==== |
Sie können exakt steuern, an welcher Position der Wert angezeigt wird. Dafür müssen Sie eine JavaScript-Funktion definieren, welche die gewünschte Position der Beschriftung (Mittelpunkt '' | Sie können exakt steuern, an welcher Position der Wert angezeigt wird. Dafür müssen Sie eine JavaScript-Funktion definieren, welche die gewünschte Position der Beschriftung (Mittelpunkt '' |