Tools für jQuery – Ein Plugin UI Elemente

Von jQuery gibt es eine eigene Bibliothek für UI- bzw. Oberflächenelemente. Diese bezieht sich allerdings eher auf Animationen und andere Effekte. Selbstverständlich stehen auch fertige Komponenten wie Kalender, Accordion und Drag ‘n Drop zu Verfügung.

jQuery Tools setzt dagegen direkt auf fertige Komponenten. Ähnlich wie auf der jQuery UI Seite lassen sich einzelne Teile direkt herunterladen oder alle Funktionen in einem Skript. Die Funktionspallette erstreckt sich über Tooltips, Tabs, Scrolling, Highlighting und Overlays.

jQuery Tools lassen sich einfach einbinden, hier ein Tab Beispiel:
Der HTML Code

^?View Code HTML

<!-- the tabs -->
<ul class="tabs">
    <li><a href="#">Tab 1</a></li>
    <li><a href="#">Tab 2</a></li>
    <li><a href="#">Tab 3</a></li>
</ul>
 
<!-- tab "content" -->
<div class="content">
    <div>First tab content. Tab contents are called "content"</div>
    <div>Second tab content</div>
    <div>Third tab content</div>
</div>

Der Javascript Code

^?View Code JAVASCRIPT

// Aufruf nach dem dom-Ready Event
$(function() {
    // Zuordnung von den ul-Tags zum Inhalt
    $("ul.tabs").tabs("div.content> div");
});

Dieses Plugin besticht durch seine saubere Trennung zwischen CSS und Javascript Code sowie durch seine kleine Größe und einfache Handhabung.

Einfach mal anschauen und testen..