Plugin installed incorrectly. Rename plugin directory 'swiftmail.backup' to 'swiftmail'.
software:tim:javascript:progressbar
Unterschiede
Hier werden die Unterschiede zwischen zwei Versionen angezeigt.
| — |
software:tim:javascript:progressbar [2021/07/01 09:52] (aktuell) |
||
|---|---|---|---|
| Zeile 1: | Zeile 1: | ||
| + | ===== Customisierte Fortschrittsanzeige ===== | ||
| + | Es ist möglich die Fortschrittsanzeige von Aufgaben zu überschreiben und anzupassen.\\ | ||
| + | Hierzu muss einfach nur eine Funktion mit dem Namen "gadget.functions.getCustomProgress" in die Datei custom.js geschrieben werden.\\ | ||
| + | Die Funktion empfängt 3 Parameter. | ||
| + | - container = Das DIV in welchem die bisherige Progressbar angezeigt wurde | ||
| + | - percent = Die bereits verstrichene Zeit in Prozent | ||
| + | - content = Der bisherige Text welcher im DIV angezeigt wurde | ||
| + | \\ | ||
| + | Wie die Progressbar überschrieben wird bleibt jedem selbst überlassen.\\ | ||
| + | Folgendes Beispiel zeigt eine sich leerende Batterie an. | ||
| + | |||
| + | <code javascript> | ||
| + | gadget.functions.getCustomProgress = function(container, percent, content){ | ||
| + | |||
| + | function getColor(value){ | ||
| + | var hue = ( (1 - value/100) * 120 ).toString(10); | ||
| + | return ['hsl(', hue, ', 100%, 50%)'].join(''); | ||
| + | } | ||
| + | |||
| + | var levelBar = jQuery('<div></div>') | ||
| + | .css('height', '100%') | ||
| + | .css('width', (100 - percent) + '%') | ||
| + | .css('float', 'right') | ||
| + | .css('background-color', getColor(percent)); | ||
| + | |||
| + | var battery = jQuery('<div></div>') | ||
| + | .css('width', '20px') | ||
| + | .css('height', '8px') | ||
| + | .css('border', '1px solid #000000') | ||
| + | .css('margin', '2px 0px 5px 0px') | ||
| + | .css('background-color', '#FFFFFF') | ||
| + | .css('float', 'left') | ||
| + | .append(levelBar); | ||
| + | |||
| + | var batteryKnob = jQuery('<div></div>') | ||
| + | .css('content', '') | ||
| + | .css('margin', '5px 0px 5px 5px') | ||
| + | .css('float', 'left') | ||
| + | .css('width', '2px') | ||
| + | .css('height', '4px') | ||
| + | .css('background-color', '#000000'); | ||
| + | |||
| + | var textContent = jQuery('<div></div>') | ||
| + | .css('text-align', 'right') | ||
| + | .text(content); | ||
| + | |||
| + | jQuery(container) | ||
| + | .css('background-image', 'none') | ||
| + | .append(batteryKnob) | ||
| + | .append(battery) | ||
| + | .append(textContent); | ||
| + | |||
| + | } | ||
| + | </code> | ||
software/tim/javascript/progressbar.txt · Zuletzt geändert: 2021/07/01 09:52 (Externe Bearbeitung)
Falls nicht anders bezeichnet, ist der Inhalt dieses Wikis unter der folgenden Lizenz veröffentlicht: 2013 T!M Solutions GmbH
