Spaces. Smartes Cloud Hosting für anspruchsvolle Webprojekte. Loslegen und Spaces testen. Von Mittwald.
Florian Fiegel 6. Januar 2009

50+ jQuery Tutorials und mehr für Einsteiger und Fortgeschrittene

Nach der Sammlung von Plugins für jQuery folgt nun eine mit Tutorials, Beispielen und wei­te­ren Ressourcen rund um jQuery. Diese Liste erhebt sinn­vol­ler­wei­se kei­nen Anspruch auf Vollständigkeit und bie­tet als bun­te Mischung ver­schie­de­ner Themengebiete im Bereich “jQuery” etwas für Designer und Programmierer glei­cher­ma­ßen.

Tutorials und Beispiele

jQuery Crash Course
Wie der Name ver­mu­ten lässt, ein Crash-Kurs in Sachen jQuery.

Working with jQuery Part 1 Part 2
jQuery-Einführung aus dem IBM-Entwicklernetzwerk.

DOM Manipulation and sor­ting
Tutorial zur DOM-Manipulation.

Model-View-Controller in jQuery
Umsetzung des MVC-Konzepts in jQuery.

Namespaces in jQuery
Ein Tutorial über das Namespacing in jQuery.

Canvas-Element
Tutorial zum Canvas-Element aus HTML 5.

Multilevel Dropdownmenü
Ein Tutorial zur Erstellung von Multi-Level-Menüs mit jQuery und CSS.

Pop-Up Menu
Ein Tutorial zur Erstellung von PopUp-Menüs.

jQuery iPod Style Drilldown Menu
Ein Menü wie auf dem iPod.

Fading Menu – Replacing Content
Erklärt knapp Menü-Items mit Fading und Ersetzung von Content.

Tooltips mit jQuery und CSS
Das Tutorial stellt dar wie Tooltips mit jQuery und CSS ange­passt wer­den kön­nen.

Making Tooltip
Ein wei­te­res Tutorial zu Tooltips ohne Plugins.

SelectBox into Slider
Das Tutorial zeigt, wie sich eine nor­ma­le Selectbox mit der Slider-Komponente paa­ren lässt.

Preloading Content
Erklärt, wie das Preloading von Content mit jQuery funk­tio­niert. Unter ande­rem für Bilder.

Creating a jQuery-Plugin from Scratch
Erklärt wie jQuery-Plugins von Null an auf­ge­baut wer­den.

Using jQuery for Background Image Animations
Animation von Hintergrundbildern mit jQuery und Javascript.

Barriereärmeres UI mit jQuery
Das Tutorial erklärt die Ersetzung von Checkboxen und Radiobuttons mit jQuery UI und UI-Reflecting.

Build a Simple RSS Reader with JQuery
Erklärt den Bau eines ein­fa­chen RSS-Readers mit jQuery.

Defining your own func­tions in jQuery
Erklärt, wie eige­ne Funktionen in jQuery defi­niert wer­den.

jQuery Image Loader
Loader für meh­re­re Bilder.

Event Delegation
Tutorial zu Events in jQuery.

Event Delegation Made Easy
Ein wei­te­res Tutorial zur ein­fa­chen Delegation von Events in jQuery.

Create a non-nati­ve jQuery Events
Zum Bau von nicht-nati­ven Events in jQuery.

jQuery Table Manipulation
Server- und cli­ent-sei­ti­ge Manipulation von Tabellen über jQuery.

Auto-popu­la­te mul­ti­ple select boxes
Mehrere Selectboxen auto­ma­tisch befül­len.

Multiselect-Transfer
Zeigt wie sich ein­fach Transfer zwi­schen Multiselectboxen lösen las­sen.

AutoCompleter
Bau eines Autocompleters für Eingabefelder.

Submit A Form Without Page Refresh
Erklärt aus­führ­lich das Senden von Formularen ohne Page-Refresh.

Getting Browser Information
Browser-Informationen mit jQuery aus­le­sen.

Animated Drop Down Menu with jQuery
Ausführliches Tutorial zu ani­mier­ten Dropdown-Menüs.

Keypress Navigation
Tutorial zur Erstellung einer Keypress-Navigation.

Learning About The Animation Abilities Of jQuery
Über die Animationsfähigkeiten von jQuery.

Ajax with jQuery
Ein wei­te­res Tutorial zu ein­fa­che­rem Ajax mit jQuery.

Simplify Ajax deve­lop­ment with jQuery
Tutorial aus dem Entwickler-Netzerk von IBM zur Entwicklung von Ajax mit jQuery.

Passing Input Arrays
Input-Arrays in jQuery für Ajax-Applikationen.

CodeIgniter and Ajax using jQuery
Ajax unter der Verschmelzung von CodeIgniter und jQuery.

Make a Video Badge
Video-Badge mit jQuery und der API von Blip.tv.

Improved Current Field Highlighting in Forms
Highlighting von selek­tier­ten Formularfeldern durch die Umgebung.

LavaLamp-Plugin
Tutorial zur Erstellung des Lavalamp-Plugins

Efficient Tag Cloud Algorithm
Algorithmus für eine Tagcloud in jQuery.

Creating a fading hea­der
Erklärt, wie sich mit jQuery eine Headergrafik mit Fading umset­zen lässt.

Fixing IE Overflow Problem
Tutorial zum Fixing von Überlaufproblemen im IE mit­tels jQuery.

Hacking trans­pa­rent PNG sup­port into IE6
Erklärt einen Hack zur Unterstützung von PNG-Transparenz im IE6 mit­tels IE PNG Fix, CSS und jQuery.

jQuery & Greasemonkey
Zur Verwendung der jQuery-Library mit dem Firefox-Add-On Greasemonkey für User-Scripts.

Sammlungen

jQuery Basics
Eine Umfangreiche Sammlung mit Tutorials zu grund­le­gen­den Funktionen in jQuery.

Learning jQuery
Umfangreiche Sammlung von Tutorials zum Thema jQuery.

15 Days of jQuery
Eine Tutorial-Serie, die vom Anfänger zum wis­sen­den Anwender führt.

jQuery for Designers
Immer mal wie­der nütz­li­che Tutorials für Webdesigner.

jQuery Tutorials For Designers
10 Tutorials für Webdesigner zur Verwendung von jQuery.

jQuery and JavaScript Coding: Examples and Best Practices
Eine gan­ze Zahl guter Beispiele für die Verwendung von jQuery.

5 Tips for bet­ter jQuery Code
5 Ratschläge für sau­be­ren und bes­se­ren Code.

Ressourcen

jQuery Reference Widget
Widget für das Mac OS X – Dashboard mit Informationen zur API.

Visual jQuery
Eine visua­li­sier­tes jQuery als Nachschlagewerk.

Cheatsheet
Cheatsheet für jQuery zum Ausdrucken oder als Online-Version für mobi­le Geräte wie das iPhone.

Weiterer CheatSheet
Zum Ausdrucken in Schwarzweiß

ThemeRoller
ThemeRoller für jQuery UI-Elemente. (tm)

Florian Fiegel

Seit 2008 freier Webworker mit Schwerpunkt auf journalistischer Berichterstattung und (Online-)PR. Täglich konfrontiert mit unzähligen Tools und Technologien im Web.

10 Kommentare

  1. […]50+ Tutorials für jQuery[…]

    Vielleicht hät­te man bei­fü­gen sol­len das es auf Englisch ist.
    Das macht die­se Seite echt unsym­pa­tisch. Ich habe
    so das Gefühl das nur auf Klicks geach­tet wird.

    • Ah so. Tutorials sind in der brei­ten Masse stes eng­lisch-spra­chig. Unsere eige­nen hier bei Dr. Web sind in deut­scher Sprache ver­fasst, wie natür­lich das gan­ze Magazin. Insofern ver­ste­he ich das geäu­ßer­te Gefühl nicht…

  2. Ich sach ein­fach mal DANKE !!!
    Genau das habe ich gesucht…

  3. Danke für die Liste – muss mich gera­de wie­der in jque­ry rein­fin­den, da passt eini­ges aus der Aufzählung – schon eine Weile her, da waren wir bei Version 1.2.3 – jetzt 1.4

    Nachtrag – der jque­ry basics Link ist tot

  4. @Mario Ich grei­fe das mal auf und set­ze das auf mei­ne Liste.

  5. @Manuel: Den Stil Deines Avatarbildchens habe ich schon häu­fig gese­hen. Gibts dafür einen Editor oder sowas? Interessiert mich mal.

  6. Gibt es denn so eine Liste oder ein Pluginliste auch für ande­re Frameworks? Mootools? Kennt da jemand was? Mit Herrn Google kom­me ich da immer nicht sehr weit, wenn ich nicht genau weiss, was ich eigent­lich haben will…

  7. Nicht zu ver­ges­sen –> jQuery for abso­lu­te begin­ners @ blog.themeforest.net

  8. Nette Sammlung :)

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.