- Best of Mootools-Plugins and Tutorials - Webstandard-Blog

Best of Mootools-Plugins and Tutorials

JavaScript
- 11 Dez, 2008
Kommentare (7)

Java-Script Frameworks gibt es unglaublich viele. Manche disqualifizieren sich aufgrund der geringen Möglichkeiten erweiterbar zu sein, andere hingegen sind in Sachen Dateigröße viel zu "großzügig" und damit oftmals sehr träge bezüglich der Ladezeiten. Andere Frameworks wie jQuery wiederum, sind flexibel und können durch kleine Plugins unproblematisch erweitert werden. Da sich aber nicht jeder, mit dem von uns bevorzugten Framework, auseinandersetzen möchte, bieten wir Euch eine kleine Sammlung an Plugins für das Framework mootools an. Vom Kalender-Plugin, über Bilder-Galerien, bishin zur Validierung von Formularendaten, auch mootools bietet einige Ansatzpunkte, Webseiten mittels JavaScript etwas Leben einhauchen zu können.

Image-menu
Ein sehr ansehnliches und einfach anzulegendes horizontal ausgerichtetes Bilder-Menu welches auf Mouse-Bewegungen reagiert ist das "image menu" von phatfusion. Funktioniert im übrigen auch im IE 5.5!

Image-gallery
Kaum eine Webseite doer ein Shop, kommt ohne dieses Feature aus. Bilder-Galerien! Die folgenden zwei Erweiterungen für Mootools zeigen Euch, wie ihr dieses Feature einfach und unkompliziert implementieren könnt.

noobSlide
Die ebenfalls vielseitig einsetzbare Bilder-Galerie "noobSlide", besticht durch ihre Einfachheit, große Variantenfielfalt und die noch nicht einmal 2,5KB.

FancyUpload
Die manchmal nicht ganz kurze Zeit eines Datei-Uploads "zu verkürzen" ist Ziel des letzten Plugins, welches wir hier vorstellen wollen. "FancyUpload" ist eine Möglichkeit die Verweildauer während des Hochladens einer Datei, anhand eines grafischen Fortschrittbalkens anzuzeigen. Aber seht selbst.

Fisheye-menu
Mac-Usern ist diese kleine horizontale "Taskleiste", in der man seine Programme ablegen kann längst ein Begriff. Aber auch Windows-User können dieses Feature dank Objektdock nutzen. Das Plugins Fisheye ermöglicht es Euch dieses Mac Dock unkompliziert in die eigene Webseite einbauen zu können.

Reflections
Spiegelungen von Bildern sind nicht erst seit den typischen "Web2.0-Logos" überall bekannt. Wie diese aber mittels eines kleinen Scriptes umgesetzt werden und mit denkbar geringem Aufwand Eure Bilder spiegeln lassen, zeigt das kleine Plugin "reflections".

Sortable-table
Tabelleninhalte nach bestimmmten Aspekten sortieren zu können, ist ein Komfort den niemand missen möchte. Ob mittels einer Suchmaske, einem Auswahlfeld oder dem "Aktivieren" der entsprechenden Spalte, dass Plugin "sortable table", biete eine Vielzahl an Möglichkeiten Tabellendaten zu sortieren.

Date-picker
Eine Reise online zu buchen, ist ohne die Angabe eines An- und Abreisedatums undenkbar. Dieses kleine aber feine Plugin "date-picker" ermöglicht es Euch relativ unproblematisch die Kalender-Funktion in jedes Formular zu integrieren können.

Form-validation
Die Überprüfung der eingegebenen Daten eines Formulars gehört nicht nur aus Gründen der Usability zu einer unverzichtbaren Aufgabe. Sondern kann auch dafür sorgen, dass bspw. Abbrüche bei Buchungen oder Kaufvorgängen zurückgehen können.

Fancy-menu
Ein Script welches dafür sorgt, dass innerhalb einer Navigation der Mausbewegung gefolgt wird und sich dann beim entsprechenden Navigationspunkt "einpendelt", trägt die Bezeichnung "Fancy menu". Ein etwas anderer Effekt, der in (fast) jeder Navigation für aufsehen sorgen wird.

Slider-menu
Das vertikale ausgerichtete Menu "Accordion" mit Akkordeon-Effekt von Ryan Scherf bringt jede Navigaton die gewisse Bewegung. Ein wirklich nett anzusehender Slide-Effekt.

Slider
Ein weiteres Script zur Ergänzung von Mootools aus dem Hause Phatfusion ist das Pluing "Slider". Hierbei kann eine Art Regler durch klicken oder ziehen, auf eine bestimmte Position versetzt werden und nimmt für einen Regler typisch, einen der gewählten Position entsprechenden Wert ein.

Tooltip
Unscheinbar, aber oftmals unverzichtbar. Tooltips! Die Möglichkeit dem User einer Webseite zusätzliche Informationen zukommen zu lassen, finden in nahezu jedem JavaScript-Framework Anwendung. Ein einfache Script für Mootools bietet Chris Esler mit seinem Tooltip-Plugin.

More Mootools

www.mootorial.com detected by Peter

Weitere Plugins oder Tutorials zum Mootools-Framework, werden selbstverständlich in der Mootools-Liste ( samt "Entdecker" ) aufgenommen.

Ähnliche Artikel zu diesem Thema:

Peter
11 Dez 2008, 16:57

Zum Einstieg ist das Mootorial zu empfehlen: http://www.mootorial.com/wiki/
rniederer
11 Dez 2008, 20:55

Super Zusammensetzung. Vielen Dank!!! Hat genial Links drunter... leider fehlen mir bei ein paar Plugins die Tutorials... :-(
Visiongraphix Webdesign
12 Dez 2008, 10:29

Ich finde die Plugins super. Nur: die alte schwarze Website von mootools mit dem Wizzard für das JavaScript vermisse ich schmerzlich. Das war einfach genial. Im Moment finde ich die Website eher undurchdringlich. Oder stehe ich mit meiner Meinung allein da?
Peter
12 Dez 2008, 16:48

Welcher Wizzard? Meinst du evtl. den Core- und den More-Builder?
Christoph 15 Dez 2008, 10:25

Sehr schöner Artikel, die Skripte kannte ich noch nicht alle, besonders die Reflections kann ich bei meinem aktuellen Projekt gut gebrauchen. :)

Ich finde die Aufteilung in Core- und Morebuilder unglücklich, da man jetzt die Abhängigkeiten selbst auflösen muss. Einen Builder für alles halte ich für sinnvoller.
Mischa
19 Dez 2008, 18:58

Hmm, da sind wirklich coole Sachen dabei. Schade eigentlich, dass ich auf Prototype angwiesen bin. Gibt's da ne Möglichkeit dennoch gleichzeitig JQuery oder eben Mootools zu verwenden?
Michael 10 Dez 2009, 10:14

Danke für die Links :)