Am Mittwoch habe ich eine neue Aufgabe bekommen. Ich sollte einen Slider programmieren, der sich in seiner Gestaltung von den normalen abhebt. Als Zusatzkriterium sollte die Ausgabe der Werte des Sliders auf zwei Kommastellen genau erfolgen. Natürlich hat wieder einmal jQuery die beste Lösung geboten, aber auch mit Script.aculo.us ist es möglich, einen Slider zu gestalten. Script.aculo.us bietet den Vorteil, das man ein Bild als handle für den Slider verwenden kann. Das geht zwar mit jQuery auch, aber bei Script.aculo.us wird dabei auch die Form des Bildes übernommen. Ansonsten bietet jQuery viel mehr Möglichkeiten einen Slider zu gestalten und ist auch sehr einfach anzuwenden.
Meine nächste Aufgabe wird mich für den Rest der Woche beschäftigen. Ich soll mehrere Preloader programmieren, die dem Besucher einer Website sagen, dass die gewünschte Seite geladen wird, damit dieser sie nicht frustriert wegklickt.
Damit habe ich auch den Donnerstag begonnen, und ich bin auch schon recht weit mit meinem Preloader. Ich habe zum Beispiel eine Prozentleiste in meine Website eingebaut, die dem User sagt, zu wieviel Prozent die (großen) Bilder bereits geladen sind. Außerdem habe ich mehrere Seiten mit animierten Bildern als Preloader erstellt und zum Schluss eine Seite, die jedesmal, wenn sie geladen wird, einen anderen, zufällig ausgewählten, Preloader zeigt.
Am Vormittag durfte ich wieder im Labor zusehen und auch ein paar Sachen selbst probieren. Diesmal ging es darum, Zellen einzufärben und sie später unter dem Mikroskop zu fotografieren. Alles in allem war das also ein sehr interessanter Tag.

Am Montag habe ich mich – surprise – weiter mit meinen Tooltips beschäftigt. Inzwischen bin ich schon ein regelrechter Tooltipologe geworden, und die Aufgabe Tooltips über verschiedenen Elementen zu erzeugen, war deshalb nicht allzu schwer für mich. Ich sollte Tooltips über normalem Text, über Links, über Tabellen und über Bildern erstellen. Außerdem sollte ich zeigen, dass man die Tooltips auch mit CSS in einer externen Datei gestalten kann und einen Tooltip mit sehr viel Text erstellen, um die Darstellung von großen Tooltips zu überprüfen.
Am Dienstag habe ich meine Arbeit von Montag erweitert. Ich habe sämtliche Aufgaben, die ich oben beschrieben habe, mit allen vier libraries bearbeitet. Eine Ausnahme bildeten overlib und cooltips. Ihre Darstellung wird durch Parameter bestimmt und nicht mit CSS. Deswegen musste ich diese Aufgabe mit diesen beiden libraries auslassen. Abschließend habe ich meine Ergebnisse in einer Excel Tabelle zusammengefasst. Ich habe die Vor- und Nachteile der einzelnen libraries beschrieben, ihre Arbeitsmethode, welche Scripts man braucht, welche Effekte möglich sind und noch einiges anderes.

Da ich ja am Mittwoch damit begonnen habe, mich nach Tooltips umzusehen, die ein bisschen aufregender ausschauen, als die normalen gelben Kästchen, möchte ich diese Aufgabe näher beschreiben. Sie besteht darin, einige libraries wie script.aculo.us herauszusuchen, mit denen man Tooltips gestalten kann und jeweils ein Beispiel damit vorzubereiten. Ich habe mich für vier libraries entschieden: qTip, coolTips, overLIB und jQuery-Tooltips. Angefangen habe ich mit qTip, und es funktioniert auch schon so, wie ich mir das vorgestellt habe.
Aber dieser Tag war auch noch aus einem zweiten Grund sehr abwechslungsreich: Wir Informatik-Summerschoolstudenten haben eine Einführung in das Zellkulturlabor erhalten. Es war wirklich interessant, und eine angenehme Erholung von der Fehlersuche am Bildschirm. Nachdem wir sogar selbst ein paar Dinge ausprobieren durften, ging es wieder zurück zu meinen Tooltips.
Auch am Freitag war das meine Beschäftigung. Ich habe es inzwischen geschafft, auch die anderen drei Beispiele zum Laufen zu bringen. Wer wissen möchte, wie das ausschauen sollte, kann sich ja das hier einmal ansehen: http://www.acooltip.com/
Man kann diese libraries in sein Script inkludieren, und mit einer Funktion schließlich aufrufen. Aber trotzdem bestehen zwischen den einzelnen Angeboten Unterschiede. Mit coolTips zum Beispiel ist es möglich, zwei Tooltips auf den gleichen Link zu setzen, während man mit jQuery unter anderem auch Bilder in seine Tooltips setzen kann.

Am Dienstag habe ich meinen Autocompleter noch etwas verfeinert und Edith hat mir auch die Ursache der Probleme mit dem Internet Explorer gezeigt. Vor allem die Scrollbars mussten angepasst werden, da es nicht besonders schön ist, eine horizontale Scrollbar zu haben, die keinerlei Nutzen hat, da ich in meinem Dropdown – Menü ja keine zu langen Einträge habe. Außerdem werden jetzt die Einträge, über die der Benutzer mit der Maus fährt, größer und unterlegt angezeigt. So schaut es nicht nur besser aus, sondern ist auch praktischer als vorher.
Es gibt zwei Arten von Autocompletern, die man mit Scriptaculous machen kann. Die eine habe ich beim letzen Beispiel verwendet, man nennt sie Local Autocompleter. Das heißt, die Daten, die dem Benutzer vorgeschlagen werden sollen, sind im gleichen File notiert wie der Autocompleter. Da das für größere Listen nicht durchführbar ist, gibt es noch einen zweiten Autocompleter. Er heißt Ajax Autocompleter und kann auf Daten aus einer anderen Datei zugreifen. Das heißt normalerweise, dass er auf ein php-Script zugreift, welches die geforderten Einträge aus einer Datenbank holt und zurückschickt. Auf diesem Prinzip basiert auch GoogleSuggest.
Mein Ajax Autocompleter hat natürlich keine Datenbank zur Verfügung, deshalb habe ich einfach eine Liste mit eigenen Daten in eine andere Datei geschrieben. Diese unordered list erscheint, sobald der Benutzer irgendwelche Buchstaben eingibt. Das war auch zum Großteil schon meine Beschäftigung für Mittwoch, außer dass ich das Stylesheet für meine beiden Autocompleter noch etwas angepasst habe. Dabei habe ich für die Listen, die ausgegeben werden sollen und für die Inputfelder Klassen definiert, damit durch das Stylesheet nicht alle Listen, bzw. Inputfelder verändert werden, sondern nur bestimmte.
Außerdem habe ich noch eine neue Aufgabe bekommen, nämlich verschiedene Möglichkeiten herauszusuchen, wie man mit Ajax Tooltips erstellen kann. Das wird mich noch einige Zeit beschäftigen ;-)