jQuery

Webseiten dynamisieren und weiterentwickeln

Programmieren Sie dynamische, interaktive Anwendungen für das Web 2.0 – mit einem der populärsten JavaScript- bzw. AJAX-Frameworks. Ralph Steyer erklärt, wie jQuery im Kern funktioniert und wie Sie die visuellen und funktionalen Möglichkeiten des Frameworks eindrucksvoll in die Praxis umsetzen.

Ihr(e) Trainer: Ralph Steyer

ISBN-Nummer: 978-3-8273-6301-5

Erscheinungsdatum: 30.03.2010

EUR 49,80

Laufzeit: 8 Stunden

Was ist ein Online-Training bzw. ein DVD-Training?

DVD oder Online-Training: Was ist der Unterschied?

Inhaltlich sind beide Trainings absolut gleich. Der Unterschied liegt bei den Nutzungsmöglichkeiten und im Vertriebsweg.

Beim Training auf DVD erhalten Sie eine Box mit allen Inhalten und einem gedruckten Bonusmagazin.

Die Bezahlung erfolgt bequem per Rechnung.

Das Online-Training ist sofort nach dem Kauf verfügbar, jederzeit und an jedem Ort. Sie brauchen nur eine Online-Verbindung und einen gängigen Webbrowser. Wenn Sie das Training herunterladen, steht es Ihnen auf Ihrem Computer auch offline zur Verfügung.

Die Bezahlung erfolgt per Kreditkarte, Paypal oder sofortüberweisung.de (nicht in allen Ländern verfügbar).

Wir wünschen Ihnen viel Freude mit dem Video-Training Ihrer Wahl – ob Online oder auf DVD.

Tutorial to go

Multiple Choice Tests

In den Warenkorb Downloads

Auf die Merkliste Tell-A-Friend Feedback verfassen

Ähnliche Video-Trainings

In diesem ersten Kapitel stellt Ihnen der Trainer jQuery vor, beginnend bei den Voraussetzungen, über das erste Beispiel bis hin zu den wichtigsten Grundbegriffen.

Grundlagen zu jQuery und seinem Umfeld
- In diesem Unterkapitel lernen Sie jQuery erst einmal kennen und Sie erfahren, wie Sie sich eine Umgebung einrichten, mit der Sie mit jQuery arbeiten können.
  
  Einleitung
  - Der Trainer zeigt Ihnen in einem kurzen Überblick den Aufbau der Homepage des jQuery- und des jQuery-UI-Projekts und wie Sie das jQuery-Framework laden können.
    
    Vorstellung von Autor und jQuery
    
    04:14
  - Welche Kenntnisse benötigen Sie für das Tutorium und was lernen Sie im Tutorium? Diese Fragen beantwortet der Trainer in diesem Film.
    
    Voraussetzungen und Ziele
    
    03:14
  - Zur Arbeit mit jQuery benötigen Sie bestimmte Software. In diesem Film werden alle Programme gezeigt, die Sie installieren sollten. Das umfasst im Wesentlichen Browser, Webserver und Entwicklungstools.
    
    Was benötigen Sie?
    
    07:51
  - Erweitern Sie Firefox und den Internet Explorer um Add-ons und machen Sie die Browser damit zu hilfreichen Werkzeugen bei der Webentwicklung. Insbesondere das Firefox-Add-on Firebug, das im Tutorium oft genutzt wird, ist dabei sehr nützlich.
    
    Add-ons
    
    04:50
  - Sie sehen in diesem Film die grundlegende Erstellung einer Webseite mit einem reinen Editor und wie die interne Verarbeitung in einem Browser erfolgt. Dabei erklärt der Trainer das Prinzip der Fehlertoleranz und wie Browser damit umgehen. Das Add-on Firebug ist dabei ein nützliches Feature zur Verdeutlichung.
    
    Webseiten erstellen und interpretieren
    
    07:56
- Der Trainer führt Ihnen in den folgenden Filmen dieses Unterkapitels die ersten Beispiele von jQuery und dessen Webumfeld sowie den Umgang mit den verschiedenen Tools vor.
  
  Erste Beispiele
  - In diesem Film zeigt Ihnen Ihr Trainer in einem einfachen Beispiel mit einem reinen Klartexteditor, wie Sie jQuery nutzen können. Dabei sehen Sie den Schutz des DOM, den Zugriff auf Elemente einer Webseite und Ereignisbehandlung.
    
    Ein erstes jQuery-Beispiel
    
    09:20
  - In dem Film sehen Sie, wie Sie Webseiten auf einem lokalen Webserver bereitstellen und über HTTP aufrufen können.
    
    Das jQuery-Beispiel über einen Webserver bereitstellen
    
    04:02
  - In diesem Film erweitert der Trainer das erste jQuery-Beispiel um zwei Schaltflächen, um unterschiedliche Reaktionen implementieren zu können.
    
    Eine Modifikation des ersten jQuery-Beispiels
    
    03:12
  - Der Autor zeigt Ihnen hier die Veränderung der Webseite mit DHTML unter Einsatz besonderer jQuery-Techniken. Konkret soll dynamisch die CSS-Klasse eines Elements ausgetauscht werden. Zusätzlich sehen Sie, wie Sie eine IDE zur Entwicklung einer Webapplikation nutzen können.
    
    Veränderung der Webseite mit DHTML
    
    08:56
  - Sie sehen in diesem Video die Analyse der Webseite bei der Ausführung der DHTML-Effekte von jQuery. Dazu kommt das Firefox-Add-on Firebug zum Einsatz.
    
    Analyse der CSS-Veränderungen
    
    02:34
  - Eine der vielen Animationsmethoden von jQuery verkleinert bzw. vergrößert ein Element je nach Zustand (ein Umschalter). Sie sehen in dem Film sowohl die Anwendung in einer einfachen Seite als auch die Integration in das komplexere Umfeld einer bereits sehr weit gestalteten, fremden Webseite.
    
    Verkleinern und Vergrößern
    
    05:15
  - Mit einer speziellen Methode von jQuery können Sie Elemente in einer Webseite ganz einfach ummanteln. In diesem Video bekommen Sie einen ersten Eindruck von der Umsetzung.
    
    Dynamisches Ummanteln von Elementen
    
    01:48
  - Der Zugriff auf die Attribute von HTML-Elementen ist mit jQuery sehr einfach, wie Sie in diesem Film lernen.
    
    Zugriff auf HTML-Attribute
    
    06:11
  - Dieses Video demonstriert die dynamische Zuweisung von CSS-Regeln zu einem Element und gibt einen Vorgeschmack auf Filter und Selektoren in jQuery.
    
    Zuweisen von CSS-Regeln
    
    06:02
- In den Filmen dieses Unterkapitels werden Sie kompakt in das Umfeld von jQuery eingeführt und wichtige Begriffe und Techniken werden geklärt.
  
  Das Umfeld – Grundlagenwissen
  - In diesem Video erhalten Sie einen Überblick zu den Programmiertechniken im Web 2.0 im Client und insbesondere darüber, was bei der Einbindung von externen JavaScript-Dateien zu beachten ist.
    
    Das Web 2.0 und die Basistechnologien
    
    08:16
  - Der Trainer demonstriert die Bedeutung des JavaScript- und jQuery-Namensraums im Zusammenhang mit verschiedenen Skripten innerhalb einer Webseite.
    
    Verschiedene Skripten – ein Namensraum
    
    07:34
  - Die Position eines Skripts kann entscheidend für die Funktionalität einer Webseite sein. In der Praxis notiert man oft Skripte an Stellen, an denen sie nach offiziellen Vorgaben nicht stehen dürfen oder sollen. Aber die Praxis erzwingt dies. Mit der jQuery-Methode ready() lösen Sie das Problem elegant.
    
    Wohin mit den Skripten?
    
    06:45
  - Die Basis für den Zugriff auf Elemente in einer Webseite bildet das DOM-Konzept. In diesem Film erläutert Ihnen der Trainer kompakt den Hintergrund.
    
    DOM
    
    04:18
  - In diesem Film bekommen Sie einen kurzen Überblick zur Verwendung von Style Sheets in einer Webseite.
    
    Style Sheets
    
    06:00
Der Trainer zeigt Ihnen in diesem Kapitel, wie Sie mit jQuery arbeiten und dessen Objekte und Methoden nutzen können.

Die Funktionsweise von jQuery
- Der Trainer erklärt kurz, was die Filme in diesem Kapitel zum Thema haben und warum diese Hintergründe so wichtig für die Arbeit mit jQuery sind.
  
  Die Themen in diesem Abschnitt
  
  01:59
- In den nun folgenden Filmen führt Sie der Trainer in die Hintergründe von Objekten in JavaScript und jQuery ein.
  
  Objekte und Klassen
  - Was zeichnet in der Bedienung eines Computers sowie in der Programmierung Objekte aus und wie können Sie mit einem Konstruktor in JavaScript Objekte erzeugen?
    
    Objekte, Klassen und Konstruktoren
    
    05:33
  - Sie werden in JavaScript respektive jQuery sehr oft mit der Erstellung von eigenen Konstruktoren konfrontiert. In diesem Film sehen Sie, wie Sie in JavaScript eine Funktion zu einem Konstruktor machen.
    
    Erstellen eines Konstruktors
    
    06:28
  - In jQuery werden Sie permanent Objekte erzeugen. Aber dies erfolgt meistens nicht über den expliziten Aufruf eines Konstruktors, sondern deklarativ mit einem Objektliteral. Mehr dazu in diesem Video.
    
    Deklarative Objekterzeugung
    
    02:56
  - Für den Zugriff auf Objektbestandteile gibt es die Punktnotation und die Array-Notation, die insbesondere in jQuery oft zum Einsatz kommt.
    
    Zugriff auf Objektbestandteile
    
    01:35
  - In JavaScript gibt es auch sogenannte Klassenelemente. Diese können Sie mit dem vorangestellten Klassennamen verwenden, ohne mit einem Konstruktor oder deklarativ zuvor ein Objekt erzeugt zu haben.
    
    Klassenelemente
    
    01:34
- In den Filmen dieses Abschnitts betrachten Sie die Möglichkeit zur Modularisierung von JavaScript über Funktionen respektive Methoden bei einem Objekt. Dabei werden insbesondere die in jQuery fundamentalen Funktionsreferenzen, anonymen Funktionen, inneren Funktionen und Callbacks beleuchtet.
  
  Funktionen und Methoden
  - Ein Funktionsaufruf erfolgt, indem Sie den Bezeichner der Funktion notieren, dem ein Klammernpaar mit eventuellen Übergabewerten folgt. Bei einer Funktionsreferenz fehlen rein formal die Klammern und sie stellt nur einen Verweis auf die Funktion und keinen Aufruf dar. Funktionsreferenzen werden in der Regel an Eventhandler gekoppelt.
    
    Funktionsaufruf versus Funktionsreferenz
    
    05:36
  - Bei der Deklaration einer Funktion kann unter Umständen der Funktionsname entfallen. Man spricht dann von einer anonymen Funktion (im Gegensatz zu einer benannten Funktion). Sehen Sie mehr dazu in diesem Film.
    
    Benannte versus anonyme Funktionen
    
    01:25
  - Eine Callback-Funktion ist eine JavaScript-Funktion, die einer Methode oder Funktion als Argument oder Option übergeben wird. Meistens wird sie als Rückgabewert eine Funktionsreferenz liefern. Wenn dabei im Inneren eine dort deklarierte Funktion die Funktionsreferenz liefert, haben Sie den Fall einer inneren Funktion vorliegen.
    
    Callbacks und innere Funktionen
    
    03:58
  - JavaScript unterstützt sogenannte Selbstaufrufe. Dies nennt man auch Rekursion oder einen rekursiven Aufruf. Dabei ruft sich eine Funktion einfach im Laufe der Abarbeitung selbst wieder auf. Gerade im Umfeld von Animationen sind solche Selbstaufrufe die zentrale Basis. jQuery kapselt in den meisten Animationstechniken solche Selbstaufrufe.
    
    Rekursion
    
    04:55
  - In Zusammenhang mit Selbstaufrufen oder allgemein verzögerten Aufrufen von Funktionen erlaubt in jQuery die Methode queue() die sequentielle Abarbeitung mehrerer Funktionsaufrufe. Mit der Methode dequeue() nehmen Sie eine Funktion vom Anfang der Warteschlange weg und führen sie aus.
    
    queue() und dequeue() – Funktionsaufruf nacheinander ausführen
    
    05:35
- Auf Arrayelemente greift man in der Regel über den Bezeichner und den Index in eckigen Klammern zu (gegebenenfalls über Schleifen). Und da Arrays auch als Objekte zu sehen sind, gibt es implementierte Methoden und Eigenschaften. Umgekehrt erlaubt JavaScript ebenso eine Iteration über Objektbestandteile. Das sehen Sie in den Filmen dieses Unterkapitels.
  
  Iteration über Arrays und Objekte
  - Klassisch wird ein Array in JavaScript über eine Instanz der Klasse Array erzeugt, also mithilfe des entsprechenden Konstruktors. Arrays können Sie aber auch mit einem Arrayliteral erzeugen. Die Anzahl der Elemente erhalten Sie über die Eigenschaft length.
    
    Arrays anlegen
    
    02:26
  - Ein großer Vorteil von Arrays ist, dass man auch über Schleifen auf die Elemente zugreifen kann. Dazu gibt es in JavaScript verschiedene Standardtechniken, welche Ihnen der Trainer in diesem Film vorstellt.
    
    Zugriff auf Arrayelemente
    
    02:12
  - In diesem Film lernen Sie die jQuery-Ergänzung each() zur Iteration über Arrays und Objekte kennen. Diese ist in jQuery bei vielen erweiterten Anwendungen von zentraler Bedeutung. Sehen Sie mehr dazu in diesem Video.
    
    Iteration über Arrays und Objekte im each()
    
    07:19
  - Sie können für each() nur einen Parameter – ein Callback auf eine Funktion – angeben. Dann wird diese Funktion für jedes passende Element ausgeführt und im Inneren steht this für das jeweils aktuelle DOM-Objekt.
    
    each() mit Callbacks
    
    04:31
- In jQuery werden alle globalen Objekte innerhalb des jQuery-Namespace gespeichert. Auf diesen greifen Sie mit dem Token jQuery oder dessen Alias $ zu. In den nun folgenden Filmen führt Sie der Trainer in die Hintergründe und interessante Methoden ein.
  
  Der jQuery-Namensraum und das jQuery-Objekt
  - Mit die wichtigste Funktion im Framework ist die Funktion jQuery(), die es mit verschiedenen Parametern gibt und die Sie auch über den Alias $() verwenden können. Sie ist unmittelbar an dem Token für den jQuery-Namespace bzw. dem jQuery-Objekt orientiert.
    
    Die Funktion jQuery() und der Alias $()
    
    04:38
  - Eine sehr interessante Möglichkeit von jQuery() respektive $() ist die Erstellung von DOM-Elementen on-the-fly aus einem String mit reinem HTML. In diesem Film sehen Sie, wie das geht.
    
    Ein Element mit jQuery() erstellen
    
    04:20
  - Wenn Sie jQuery() oder $() als Parameter ein Element bzw. eine Gruppe von Elementen übergeben, werden diese ummantelt und in den Kontext des jQuery-Framework eingegliedert. Dann können Sie die Eigenschaften und Methoden aus dem jQuery-Namensraum bzw. der jQuery-Bibliothek darauf anwenden.
    
    Mit jQuery() Elemente ummanteln
    
    02:21
  - Wenn Sie in jQuery() bzw. $() einen Callback als Parameter übergeben, wird dieser unmittelbar nach Aufbau des DOM ausgeführt. Es handelt sich dann um eine Kurzform von $(document).ready().
    
    Eine Funktion ausführen mit jQuery(Callback )
    
    01:21
  - Mit der Methode eq() haben Sie bei jQuery-Objekten Zugriff auf den Index gleichartiger Elemente. Sie können damit auf einfache Weise genau ein Element auswählen. Als Parameter gibt man einfach den Index bzw. die Position an. Diese startet mit dem Wert 0 und geht bis length – 1.
    
    Gezielte Auswahl mit eq()
    
    01:28
  - Mit get() können Sie aus dem jQuery-Framework direkt auf den DOM zugreifen. Insbesondere ist diese Art des Zugriffs auch auf Elemente möglich, die nicht über das jQuery-Objekt verfügbar sind. Man verwendet get() zum Beispiel dann, wenn man direkt auf DOM-Elementen operiert und keine built-in-Funktionen von jQuery benötigt.
    
    Rückgabe der DOM-Elemente mit get()
    
    01:11
  - Verschiedene Techniken in jQuery arbeiten mit dem Index von einem Element. Mit der Methode index() können Sie diesen bestimmen. Wie das funktioniert, sehen Sie in diesem Video.
    
    Bestimmen des Index mit index()
    
    01:23
  - In diesem Film sehen Sie das Verwalten eines Datenspeichers mit Metainformationen für Elemente mit den jQuery-Methoden data() und removedata().
    
    Datenspeicher für Elemente – data() und removedata()
    
    03:17
  - Wenn Sie neben jQuery weitere Frameworks verwenden wollen, können Sie eventuelle Namenskonflikte durch geschickte Nutzung des Namensraums oder die Methode jQuery.noConflict() auflösen.
    
    Gemeinsame Verwendung von jQuery und anderen Frameworks
    
    03:19
  - Unter Optionen versteht man in jQuery reine JavaScript-Objekte. Diese verwendet man in jQuery meist deklarativ über einen Block, der mit geschweiften Klammern gekennzeichnet wird. Die Optionen werden mit Kommata getrennt und bestehen aus einem Bezeichner der Option, einem Doppelpunkt und dem folgenden Wert.
    
    Optionen in jQuery
    
    00:49
- In JavaScript können Sie neben der Erzeugung von eigenen Objektdefinitionen Prototyping betreiben. Damit erzeugen Sie neue Datentypen auf Basis von bestehenden Datentypen. In jQuery wird davon sehr viel Gebrauch gemacht.
  
  Prototyping, Erweiterungen und Erstellung neuer Datentypen
  - Prototyping erweitert eine Klasse beziehungsweise ein Objekt mit neuen Eigenschaften und/oder Methoden. Für ein existierendes Objekt bedeutet Prototyping, dass es durch die Spezialisierung des Datentyps selbst erweitert werden kann, nachdem (!) es bereits erzeugt wurde.
    
    Objekte erweitern
    
    06:57
  - jQuery stellt eine Erweiterung des Prototyping-Konzepts zum Anlegen neuer Datentypen zur Verfügung, mit der vor allen Dingen jQuery-Plug-ins erzeugt werden. jQuery verbirgt das ganze Konzept hinter einer einfachen Syntax, die mit der Methode extend() umgesetzt wird.
    
    jQuery selbst erweitern – extend()
    
    06:35
Wie Sie mit Selektoren und mit Filtern bestimmte Elemente einer Webseite beeinflussen können, ist Inhalt dieses Kapitels.

Bestimmte Bestandteile einer Webseite gezielt auswählen
- Der Trainer erklärt, was die Filme in diesem Kapitel zum Thema haben – die Selektionsmöglichkeiten der Bestandteile einer Webseite über Selektoren und Filter, die eine Art Verbindung aus XPath und CSS-Selektoren darstellen.
  
  Die Themen in diesem Abschnitt
  
  04:59
- Unter einem Selektor versteht man die Auswahl eines oder mehrerer Elemente im Baum einer Webseite. Wenn Selektoren bei irgendwelchen Funktionen oder Methoden in jQuery als Argumenttyp angegeben werden, können Sie dafür alles hinschreiben, was der jQuery-Konstruktor akzeptiert.
  
  Selektoren
  - Die Basisselektoren in jQuery entsprechen im Wesentlichen klassischen CSS-Selektoren. Man greift über ein Element, eine ID etc. auf die Bestandteile der Webseite zu und erhält als Resultat ein Element bzw. ein Array mit Elementen.
    
    Die Basisselektoren in jQuery
    
    02:20
  - Über hierarchische Selektoren können Sie die Position in einem Baum über Eltern-Kind-Beziehungen, Geschwister und Vor- sowie Nachfahren beschreiben.
    
    Hierarchische Selektoren
    
    05:43
- Filter in jQuery entsprechen in etwa den Knotentests in XPath. Damit spezifiziert man für eine vorangestellte Gruppe von Elementen weitere Bedingungen. Die folgenden Filme erklären Ihnen diese Vorgehensweise.
  
  Filter
  - Filter werden in jQuery mit einem Doppelpunkt einer Gruppe von Elementen nachgestellt. Die grundlegenden Filtermöglichkeiten fast man in jQuery unter dem Begriff Basisfilter zusammen. Diese lernen Sie in diesem Film kennen.
    
    Basisfilter
    
    05:05
  - Inhaltsfilter erlauben in jQuery die Selektion eines Elements über die Bewertung von Inhalt, Sichtbarkeitsfilter hingegen auf Grund der Sichtbarkeit des Elements.
    
    Inhaltsfilter und Sichtbarkeitsfilter
    
    03:15
  - Mit Attributfiltern können Sie entweder das Vorkommen oder den Inhalt von Attributen bei HTML-Tags bzw. Elementen filtern. Wie bei den meisten Filtern in jQuery ist die Anwendung einfach. Das sehen Sie in diesem Film.
    
    Attributfilter
    
    04:10
  - Kindfilter agieren immer von einem Elternelement aus und filtern die Kinder heraus, die mit bestimmten Gegebenheiten übereinstimmen.
    
    Kindfilter
    
    00:58
  - Mit diesen Filtern können Sie spezielle Auswahlen bei Formularelementen setzen. Filter für Formularelemente dienen zum Filtern des Typs eines Formularelements, während bei Formularfiltern der Zustand eines Formularelements gefiltert wird.
    
    Filter für Formularelemente und Formularfilter
    
    05:28
- In direktem Zusammenhang mit Filtern stehen verschiedene Filtermethoden, die in ihrer Wirkung zum Teil auch mit Filtern übereinstimmen. Dies zeigt Ihnen der Trainer in den Filmen dieses Unterkapitels.
  
  Filtermethoden
  - Die Methode not() arbeitet im Wesentlichen wie der Filter :not(). Aus einer Menge mit Elementen werden die herausgefiltert, die dem Selektor entsprechen. Sie sind also in der Ergebnismenge nicht (!) enthalten.
    
    Die Methode not()
    
    02:10
  - Die Methode slice() filtert alle Elemente ab einem Startwert (ein Index). Sie können auch einen optionalen Endwert angeben. Es wird also ein Indexbereich mit dieser Filtermethode angegeben.
    
    Die Methode slice()
    
    00:52
  - Mit der Methode filter() entfernen Sie alle Elemente, die nicht dem als Parameter angegebenen Filter entsprechen. Dabei können Sie neben einem Selektor auch eine Funktion in Form eines Callbacks oder einer anonymen Funktion als Parameter angeben.
    
    Die Methode filter()
    
    00:45
  - Mit der booleschen Methode is() können Sie testen, ob ein als Parameter angegebener Ausdruck mit der voranstehenden Selektion übereinstimmt.
    
    Die Methode is()
    
    01:12
Auch auf die CSS-Eigenschaften von Elementen haben Sie mit jQuery Zugriff. Wie das funktioniert, demonstriert Ihnen der Trainer anhand zahlreicher Beispiele in diesem Kapitel.

Mit jQuery und Style Sheets formatieren
- Das jQuery-Framework bietet mächtige Unterstützung für den Umgang mit Style Sheets. Zwar kann man mit reinem DHTML mittels des Style-Objekts auf CSS-Eigenschaften zugreifen, aber man hat mit verschiedenen Problemen zu kämpfen. Über jQuery werden Eigenschaften normalisiert und in allen unterstützten Browsern weitgehend identisch verfügbar gemacht.
  
  Grundlegende Ausführungen zum Umgang mit CSS
  
  07:02
- In den Filmen des nun folgenden Unterkapitels lernen Sie die Methoden zum allgemeinen Zugriff auf die CSS-Eigenschaften von Elementen kennen.
  
  Zugriff auf CSS-Eigenschaften
  - Mit der Methode css() fragen Sie entweder den Wert von einer CSS-Eigenschaft ab (Angabe der Eigenschaft als String-Parameter) oder Sie setzen die Werte von CSS-Eigenschaften.
    
    Die Methode css()
    
    05:27
  - Sie können mit jQuery dynamisch CSS-Klassen Elementen hinzufügen und auch wieder wegnehmen. Hier lernen Sie zwei Standardmethoden von jQuery zu diesem Zweck kennen.
    
    Die Methoden addClass() und removeClass()
    
    02:17
  - Mit hasClass() können Sie überprüfen, ob Elementen eine CSS-Klasse zugewiesen wurde. Wie das funktioniert, sehen Sie in diesem Video.
    
    Die Methode hasClass()
    
    02:04
  - Mit der Methode toggleClass() können Sie Klassen hinzufügen und wegnehmen – je nachdem, ob die Klasse zugewiesen ist oder nicht.
    
    Die Methode toggleClass()
    
    01:01
- Eines der größten Probleme bei der Gestaltung sowie dynamischen Veränderung einer Webseite ist die Positionierung von Elementen. Über CSS können Sie allerdings recht gut den Positionsaufbau von Elementen in einer Webseite kontrollieren. Das jQuery-Framework vereinfacht und kapselt den Zugang hierzu.
  
  Methoden zur Positionierung
  - Mit Hilfe der Methode position() bestimmen Sie die top- und left-Werte von einem Element relativ zu dessen Offset-Elternelement.
    
    Bestimmen der Position mit position()
    
    02:52
  - Die Methode offset() liefert als Rückgabe den aktuellen Versatz (top und left) des ersten passenden Elements. Mit offsetParent() erhalten Sie hingegen ein jQuery-Objekt bzw. eine jQuery-Collection mit dem ersten positionierten Elternelement.
    
    offset() und offsetParent()
    
    03:57
  - Mit den Methoden scrollTop() und scrollLeft() können Sie die Werte abfragen, um die ein Element nach unten bzw. zur Seite gescrollt wurde. Und wenn Sie den Methoden einen Integer-Wert als Parameter übergeben, können Sie ein Element um den angegebenen Wert in Pixel verschieben.
    
    Methoden zum Scrollen
    
    02:52
- Für viele Manipulationen und Darstellungen im Rahmen einer Webseite sind die Breite und Höhe wichtig. jQuery stellt für den Zugriff auf die Breite und Höhe von Elementen geeignete Methoden zur Verfügung, die sich an den entsprechenden CSS-Eigenschaften orientieren.
  
  Höhe und Breite
  - Die Methoden height() und width() liefern die Höhe und Breite des ersten passenden Elements in Pixel. Wenn Sie hingegen einen numerischen Parameter angeben, setzen Sie die Höhe bzw. Breite des Elements.
    
    height() und width()
    
    02:05
  - Bei visuellen Elementen können Eigenschaften über die "natürliche" Größe des Elements hinaus den Raum beeinflussen, den das Element benötigt – der Rand (margin), der Rahmen (border) und die Polsterung (padding). Sie haben deshalb auch auf die inneren und äußeren Abmessungen eines Elements zu achten.
    
    Innere und äußere Maße
    
    02:07
- Wichtiger Bestandteil von jQuery UI sind ein Themen-Framework auf Basis von CSS mit einem ThemeRoller-Tool zur Auswahl, Anpassung und Übernahme vorgefertigter Designs sowie eine Galerie mit vorgefertigten Designs. Die Filme in diesem Unterkapitel zeigen Ihnen, wie Sie den ThemeRoller nutzen können.
  
  Der ThemeRoller von jQuery UI
  - Die Themen im jQuery UI-Framework sind CSS-Bibliotheken, ohne die viele Komponenten von jQuery UI nicht korrekt in einer Webseite dargestellt werden, die aber auch für normale Webseiten verwendet werden können.
    
    Der Download eines CSS-Themas
    
    03:39
  - In diesem Video sehen Sie die Analyse der CSS-Bibliothek, die der ThemeRoller generiert hat, und Tricks, wie Sie die enthaltenen Klassen identifizieren und für eigenen Elemente in der Webseite anwenden können.
    
    Analyse der ThemeRoller-CSS-Dateien und Anwendung
    
    05:10
  - Erstellen Sie mit dem ThemeRoller auf einfache Weise eine individuell angepasste CSS-Datei. Der Trainer führt Ihnen dieses Vorgehen in diesem Video vor.
    
    Roll your own
    
    00:57
Das Hinzufügen von Elementen (Knoten) ist ebenfalls mit jQuery möglich. Der Trainer stellt Ihnen hierzu die gebräuchlichsten Methoden vor.

Die Webseite gezielt verändern und auswerten
- Über jQuery werden Ihnen zahlreiche Methoden zur Verfügung gestellt, über die Sie die Webseite bzw. deren Inhalt manipulieren können. Aber auch das Durchlaufen der Webseite lässt sich mit diversen Methoden in jQuery hervorragend bewerkstelligen. Diesen Techniken widmen Sie sich gemeinsam mit dem Trainer in den folgenden Filmen.
  
  Grundlegende Bemerkungen zum Inhalt in diesem Abschnitt
  
  01:04
- Das DOM-Konzept versteht eine Webseite als Baum aus Knoten (nodes) und Achsen (axis), der sich aus einer einzigen Wurzel (root) entwickelt. Je nach Typ eines Knotens stellt das DOM-Konzept nun verschiedene Methoden und Eigenschaften zur Verfügung, um Knoten zu manipulieren. jQuery abstrahiert bzw. normalisiert diese Vorgänge und stellt sie browserübergreifend, komfortabel und sicher zur Verfügung.
  
  Ändern, Hinzufügen und Entfernen von Knoten
  - Mit der Methode html() können Sie den Inhalt eines Textknotens abfragen oder setzen (interpretiert). Fast analog arbeitet die Methode text(), denn die enthaltenen HTML-Tags werden nicht zurückgegeben bzw. beim Setzen intern maskiert.
    
    Inhalte von Knoten abfragen und verändern – html() und text()
    
    03:20
  - Mit val() kommen Sie in jQuery an den Inhalt von Formularfeldern. In diesem Film sehen Sie neben einer einfachen Anwendung auch, wie Sie damit und mit anderen jQuery-Techniken auf einfache Weise ein Plausibilisierungssystem erstellen können.
    
    Inhalt von Formularfeldern – val()
    
    06:54
  - Über die Methoden append(), prepend(), prependTo() und appendTo() können Sie in einer Webseite neue Inhalte an bestehende Inhalte anhängen. In diesem Film lernen Sie diese Methoden kennen.
    
    Einfügen von Inhalt in eine Webseite
    
    05:20
  - Mit der Methode after() fügen Sie Inhalt hinter jedem mit dem Selektor übereinstimmenden Element hinzu. Entsprechend mit before() vor jedem mit dem Selektor übereinstimmenden Element. Mit insertAfter() und insertBefore() gibt es weitere Methoden, denen ein Selektor als Parameter übergeben wird.
    
    Knoten nachher oder vorher einfügen
    
    02:21
  - Über jQuery können Sie bestehende Inhalte mit Strukturen ummanteln. Die Knoten werden damit zu Kindknoten einer umgebenden Struktur. Mit der Methode wrap() ummanteln Sie alle vorangestellten selektierten Elemente. Über wrapAll() werden alle passenden Elemente in ein einzelnes Wrapper-Element eingeschlossen.
    
    Ummanteln
    
    03:16
  - Mit replaceWith() und replaceAll() können Sie Elemente in einer Webseite ersetzen. Dabei ersetzt replaceWith() alle passenden Elemente durch die spezifizierten HTML- oder DOM-Elemente und entfernt die ersetzten Elemente aus dem bestehenden DOM. Bei replaceAll() geben Sie als Parameter einen Selektor an.
    
    Ersetzen mit replaceWith() und replaceAll()
    
    02:02
  - Die Methoden empty() und remove() dienen zur Beseitigung von Knoten. Mit der Methode empty() entfernen Sie alle Kindelemente aus dem spezifizierten Satz an Elementen. Mit remove() hingegen entfernen Sie alle passenden Elemente aus dem DOM (mit Kindelementen).
    
    Entfernen mit empty() und remove()
    
    05:06
  - Mit jQuery ist auch ein Klonen von Elementen möglich, auf Wunsch sogar inklusive der dem Element zugeordneten Eventhandler.
    
    Elemente mit clone() vervielfachen
    
    03:10
- Zum Suchen von bestimmten Strukturen in der Webseite stellt jQuery eine Reihe von leistungsfähigen Methoden bereit. In reinem JavaScript oder DHTML gibt es kaum äquivalente Alternativen.
  
  Traversieren
  - Mit children() können Sie alle unmittelbaren Kindelemente als jQuery-Objekt zurückgeben lassen. Analog liefert parent() das direkte Elternelement oder die direkten Elternelemente. Die Methode parents() liefert alle Vorfahren eines Elements mit Ausnahme der Wurzel.
    
    Von Kindern und Eltern – children(), parent() und parents()
    
    05:36
  - Mit closest() erhalten Sie einen Satz an Elementen nahe dem nächsten Elternelement (Kindelemente), das mit dem spezifizierten Selektor übereinstimmt (inklusive dem Startelement). Die Methode offsetParent() liefert eine jQuery-Collection mit dem Inhalt des ersten positionierten Elternelements, das mit dem Selektor übereinstimmt.
    
    offsetParent() und closest()
    
    02:56
  - Die Methode next() gibt ein jQuery-Objekt mit den nächsten direkten Geschwistern eines Elements zurück. Die Methode nextAll() liefert alle Geschwisterelemente nach dem aktuellen Element. Analog erhalten Sie mit prev() das direkte Geschwisterelement und mit prevAll() alle Geschwisterelemente vor dem aktuellen Element. Mit siblings() erhalten Sie alle Geschwisterelemente.
    
    Über Geschwister
    
    01:46
  - Mit find() durchsuchen Sie die Nachfolgerelemente eines Elements, ob sie mit einem Filterausdruck übereinstimmen. Mit contents() erhalten Sie alle Kindknoten (inklusive Textknoten) innerhalb eines betroffenen Elements.
    
    Finden mit find() und contents()
    
    01:10
Auch auf Ereignisse haben Sie Zugriff. Mit jQuery gelingt Ihnen dieser fast im Handumdrehen. Mehr dazu in diesem Kapitel.

Die Reaktion auf Ereignisse
- In den Filmen dieses Kapitels kümmert sich der Trainer um die Ereignisbehandlung mit jQuery im weitesten Sinn. Das Framework vereinfacht und vereinheitlicht die extrem inhomogene Ereignisbehandlung in verschiedenen Browsern.
  
  Grundlegende Ausführung zur Reaktion auf ein Ereignis
  
  07:48
- Das Ereignissystem von jQuery normalisiert das Event-Objekt über jQuery.Event (samt den Namen der verfügbaren Eigenschaften und Methoden) entsprechend den Standards des W3C und sorgt für eine einheitliche Behandlung in allen unterstützten Browsern. Insbesondere wird garantiert, dass das Ereignisobjekt zuverlässig zu den Eventhandlern weitergereicht wird.
  
  Das Event-Objekt
  - Der Konstruktor des Event-Objekts in jQuery liegt offen und kann zur Erzeugung von Ereignisobjekten verwendet werden. Meist werden Event-Objekte jedoch in Verbindung mit Event-Helpern und Ereignismethoden automatisch erzeugt.
    
    Das Event-Objekt erzeugen
    
    05:04
  - Das Ereignisobjekt in jQuery besitzt eine Reihe von Eigenschaften, die an den Attributen des klassischen Eventobjekts orientiert sind. In diesem Video lernen Sie wichtige Events kennen.
    
    Auswertung verschiedener Event-Eigenschaften
    
    02:50
  - In Bezug auf das Ereignisobjekt gibt es auch einige spezielle Methoden. Diese dienen im Wesentlichen dazu, bestimmte Defaultreaktionen des Browsers zu unterbinden.
    
    Stoppmethoden im Typ jQuery.Event
    
    02:49
- In den folgenden Filmen sehen Sie spezielle Methoden und Funktionen zur Ereignisbehandlung, die in jQuery eine sehr flexible und weitgehende Reaktion auf Ereignisse gestatten.
  
  Spezielle Methoden und Funktionen in der Ereignisbehandlung
  - Die Methode $(document).ready() wird ausgelöst, wenn der DOM einer Webseite korrekt aufgebaut ist. Sie gewährleistet den Schutz des DOM!
    
    Ich haben fertig – die ready()-Methode
    
    02:22
  - Die Methode bind() verwendet zwei oder drei Parameter und gibt ein Objekt vom Typ jQuery zurück. Damit binden Sie einen Handler an eines oder mehrere Ereignisse für jedes passende Element. Mit unbind() lösen Sie die Bindung wieder.
    
    Die Methoden bind() und unbind()
    
    07:37
  - Mit dieser Methode one() binden Sie einen Handler an ein oder mehrere Ereignisse für jedes passende Element. Der gebundene Handler wird nur genau einmal für jedes Element ausgeführt.
    
    The one and only – one()
    
    01:05
  - Mit der Methode trigger() geben Sie als Parameter das Ereignis und die gewünschten Daten an. Die Verwendung von Triggern in jQuery ist an die Defaultreaktion des Browsers für ein spezifisches Ereignis gekoppelt, wie Sie sie an anderer Stelle spezifiziert haben oder wie sie automatisch vom Browser ausgelöst wird.
    
    Trigger
    
    04:29
  - Die Methode triggerHandler() ist der Methode trigger() sehr ähnlich. Auch sie führt alle verbundenen Eventhandler eines Elements für einen spezifischen Ereignistyp aus, nur gibt es ein paar kleine Unterschiede in der dahinterliegenden Ereignisbehandlung.
    
    TriggerHandler
    
    01:02
  - Die Methode live() liefert als Rückgabe ein Objekt vom Typ jQuery und benötigt als Parameter den Typ des Ereignisses und eine Callback-Funktion. Die Methode, die in jQuery als Live Event bezeichnet wird, bindet einen Handler an ein Ereignis wie click für alle aktuellen sowie zukünftigen übereinstimmenden Elemente.
    
    Leben und Sterben – live() und die()
    
    03:47
  - In diesem Film lernen Sie die Funktion hover() und die Funktion toggle() zur Unterstützung von Interaktion und Animation kennen.
    
    Hilfsfunktionen für die Interaktion
    
    04:54
  - Die "normalen" Eventhandler aus JavaScript/DOM bzw. HTML werden in jQuery über Event Helper gekapselt. Sie sind einmal ganz normale Methoden, die aber an bestimmte Ereignisse gekoppelt sind.
    
    Event Helper
    
    00:45
  - In diesem Video erhalten Sie einen kurzen Überblick über die erweiterte Unterstützung von Ereignissen im jQuery-Framework.
    
    Erweiterte Eventunterstützung
    
    01:10
Animation leicht gemacht! Der Trainer zeigt Ihnen in den folgenden Filmen, wie Sie solche elegant erstellen können.

Animationstechniken
- In den Filmen dieses Kapitels kümmern Sie sich um Effekte und Animationstechniken in jQuery. Diese sind für Besucher einer Webseite sehr eindrucksvoll, aber rein von der Programmierseite eines der einfachen Themen im jQuery-Framework.
  
  Grundlegende Bemerkungen zu Effekten und Animationen
  
  02:19
- Die Methode show() zeigt Elemente an, wenn sie versteckt sind. Vollkommen analog verstecken Sie mit der Methode hide() sichtbare Elemente.
  
  Anzeigen und Wegblenden – die Methoden show() und hide()
  
  01:25
- Mit den drei Methoden slideDown(), slideUp() und slideToggle() erzielen Sie eine gleitende Ein- und Ausblendung von Elementen über die zeitgesteuerte Veränderung der Höhe eines Elements.
  
  Gleiteffekte – slideDown(), slideUp() und slideToggle()
  
  01:00
- Mit den Methoden fadeIn(), fadeOut() und fadeTo() stellt jQuery Möglichkeiten zur Verfügung, um die Transparenz von Elementen animiert zu verändern.
  
  Transparenzeffekte – fadeIn(), fadeOut() und fadeTo()
  
  01:25
- Jede Animationsmethode von jQuery liefert Ihnen ein Objekt vom Typ jQuery. Auf solch ein Objekt können Sie wieder selbst eine Methode von jQuery anwenden. Deshalb können Sie Animationen (wie auch andere jQuery-Methoden) verketten. Über die Punktnotation werden die Methodenaufrufe einfach nacheinander notiert und dann sequenziell abgearbeitet.
  
  Verketten von Animationen
  
  02:06
- Wenn eine Animation am Laufen ist, können Sie diese mit der Methode stop() unterbrechen.
  
  Stoppen von Animationen
  
  01:04
- Bei der direkten Programmierung von selbst definierten Animationen würden Sie zur Steuerung der Zeitabläufe höchstwahrscheinlich rekursiv mit window.setTimeout() arbeiten und damit CSS-Eigenschaften dynamisch verändern. So ein Aufwand ist in jQuery nicht notwendig, denn es gibt dafür die Methode animate().
  
  Selbst definierte Animationen mit animate()
  
  06:18
Wie sich Ajax mit jQuery realisieren lässt, ist Inhalt dieses Kapitels. Der Trainer zeigt Ihnen diese recht neue Methode, um Daten von entfernten Servern zu holen.

Die AJAX-Unterstützung
- AJAX hat das Web revolutioniert und legt die Grundlage für moderne RIAs. In den Filmen dieses Unterkapitels erfahren Sie die Grundlagen von AJAX.
  
  Grundlagen von AJAX
  - Dieses Kapitel steht ganz im Fokus von AJAX und des Web 2.0 und wie jQuery diese Basis von fast sämtlichen Rich Internet Applications unterstützt.
    
    Vorbemerkungen zu AJAX und zum Web 2.0
    
    04:27
  - Alle modernen Browser bieten zur Unterstützung der asynchronen Kommunikation zwischen Client und Webserver eine Schnittstelle. Diese XHR- bzw. XMLHttpRequest-Objekte sind unmittelbar an dem internen Aufbau von HTTP orientiert und bilden das Rückgrat jeder AJAX-Anfrage. In diesem Video demonstriert Ihnen der Trainer die manuelle Erstellung und zeigt, was an Details zu wissen ist.
    
    Die technische Basis von AJAX
    
    08:33
- In diesem Unterkapitel lernen Sie die Methoden zur Unterstützung von AJAX in jQuery kennen.
  
  AJAX-Methoden in jQuery
  - AJAX-Requests verlaufen immer ähnlich. Im Wesentlichen braucht man den URL der Serverressource, die Methode der Datenübertragung, eventuell zum Server gesendete Daten, die Information, ob asynchron oder nicht, und eine Callback-Funktion für die Reaktion. Somit ist der Aufbau von AJAX-Methoden in jQuery zwingend.
    
    Grundlagen zu AJAX-Methoden
    
    02:33
  - Mit den Methoden $.get() und $.post() können Sie per AJAX Klartext vom Webserver anfordern.
    
    Klartext per $.get() und $.post() vom Webserver anfordern
    
    01:36
  - Mit den Methoden $.get() und $.post() können Sie per AJAX Klartext vom Webserver anfordern, der mit HTML durchsetzt ist. Dieser kann dann im Browser interpretiert werden.
    
    Klartext mit HTML-Fragmenten per $.get() und $.post() vom Webserver anfordern
    
    01:55
  - Sie können bei der AJAX-Anfrage Daten zum Webserver schicken, wie Sie in dem Film sehen. Als konkretes Beispiel programmieren Sie eine Zugangsverifizierung.
    
    Daten bei der Anforderung per $.get() und $.post() zum Webserver senden
    
    09:54
  - In diesem Film werfen Sie einen kurzen Blick auf die jQuery-AJAX-Methoden zur fortgeschrittenen Programmierung.
    
    Fortgeschrittene AJAX-Methoden
    
    01:22
- In diesem Unterkapitel lernen Sie die Verarbeitung von strukturierten Informationen per jQuery kennen, die per AJAX vom Server angefordert werden.
  
  Erweiterte Datenanforderungen
  - Sie können per AJAX Klartext mit XML-Struktur anfordern. Im Client steht Ihnen dann als Antwort ein vollständiger DOM zur Verfügung!
    
    XML-Daten anfordern und verarbeiten
    
    05:08
  - JSON bietet fast die gleiche Funktionalität und Flexibilität wie XML, ohne dessen Komplexität und Probleme in verschiedenen Browsern. Die Methode getJSON() aus dem jQuery-Framework macht den Umgang mit JSON zudem fast zum Kinderspiel.
    
    JSON-Daten anfordern und verarbeiten
    
    02:59
  - Twitter stellt Tweets in Form von JSON zur Verfügung. Diese chronologisch abwärts sortierte Liste von Einträgen kann man aus einem Programm heraus verwerten. Und das will der Trainer hier tun. Dabei verwendet er JSONP, denn die Beiträge kommen nicht vom eigenen Server.
    
    Twitter-Tweets per JSONP anfordern
    
    04:16
  - Normalerweise lädt man eine JavaScript-Datei unmittelbar beim Laden der Webseite. Mit der jQuery-Methode getScript() kann man Funktionalitäten auf mehrere Bibliotheken aufteilen und bei Bedarf bestimmte Funktionalität gezielt nachladen.
    
    Ein Skript per AJAX nachladen – jQuery.getScript()
    
    01:23
Wie Sie jQuery UI, die Oberfläche von jQuery, verwenden können, demonstriert Ihnen der Trainer in den nachfolgenden Filmen.

Das Framework für die Oberfläche
- In diesem Video sehen Sie einen ersten Überblick zu jQuery UI anhand der Webseite des Projekts und der interaktiven Dokumentation.
  
  Ein Überblick
  
  06:31
- jQuery UI ist nicht in der normalen jQuery-Bibliothek enthalten. Sie müssen sich die erweiterte Bibliothek zusätzlich besorgen und für Ihre Webseiten bereitstellen. Ebenso müssen dann weitere Bibliotheken eingebunden werden. In diesem Film erfahren Sie, wie das geht.
  
  Wie nutzt man jQuery UI grundsätzlich?
  
  02:44
- Sobald die Bibliotheken in Ihrer Webseite referenziert sind, können Sie die Komponenten und Widgets im Quellcode verwenden. In der Regel besteht auch die Anwendung komplexer Komponenten aus wenigen Quellcodezeilen. In diesem Film sehen Sie, wie einfach Sie ein Objekt in der Webseite verschiebbar machen können.
  
  Verwenden der Komponenten in jQuery UI
  
  02:28
- Was passiert im Hintergrund, wenn Sie mit einer jQuery-UI-Komponente arbeiten, und wie können Sie die Komponenten anpassen? In diesem Video sehen Sie es anhand eines Dialogs.
  
  Genauere Analyse der UI-Komponenten und Anpassung
  
  07:07
- Sie sehen als weitere Beispiele von jQuery-UI-Komponenten den Umgang mit einem Datepicker, einer Accordion-Komponente und einer Tabs-Komponente sowie die Anwendung von jQuery UI-Komponenten in einem komplexen Webseitenumfeld. Zudem sehen Sie, wie Sie Methoden aus jQuery UI bei Bedarf verketten.
  
  Verschiedene jQuery-UI-Komponenten
  
  06:00
- In diesem Video lernen Sie, wie Sie die Werte der Optionen von UI-Komponenten dynamisch auswerten und setzen können und wie Sie verschiedene Komponenten gemeinsam verwenden (anhand eines Schiebereglers – Slider – und eines Dialogs).
  
  Auswertung von UI-Komponenten und gemeinsame Verwendung
  
  06:07
- Die Verwendung des Eventobjekts in jQuery-UI-Komponenten und die Reaktion mittels Ereignisoptionen sowie der bind()-Methode sind Inhalte dieses Videos.
  
  Zugriff auf das Eventobjekt in UI-Komponenten
  
  02:29
- In diesem Film sehen Sie verschiedene erweiterte und sehr eindrucksvolle, aber dennoch ganz leicht anzuwendende Effekte von jQuery UI.
  
  Effekte mit jQuery UI
  
  03:18
- In jQuery UI wird die Methode animate() so erweitert, dass Sie darüber auch Farben animieren können.
  
  Erweiterte Animationen mit jQuery UI
  
  01:18
Plug-ins sind als abschließendes Kapitel an der Reihe. Wie Sie vorhandene Plug-ins verwenden, komplexe Plug-ins einsetzen oder selbst welche registrieren, zeigt Ihnen der Trainer in diesem Kapitel.

Die Verwendung von jQuery-Plug-ins
- Was sind jQuery-Plug-ins? Hier erfahren Sie, was unter diesem Begriff im Umfeld von jQuery verstanden wird. Der Kern des gesamten jQuery-Frameworks besteht aus jQuery Core und jQuery UI. Aber das Framework ist im Grunde beliebig erweiterbar. Diese Erweiterungen werden Plug-ins genannt. Im Grunde handelt es sich um reine JavaScript-Bibliotheken, die aber gewisse vorgegebene Regeln einhalten müssen.
  
  Einleitung und Grundlagen
  
  01:17
- In diesem Film spielt der Trainer durch, wie Sie grundsätzlich ein Plug-in verwenden können, welches Ihnen über die Plug-in-Seite von jQuery zur Verfügung gestellt wird.
  
  Ein vorhandenes Plug-in verwenden
  
  06:22
- Ein Plug-in erstellen Sie, wenn Sie eine bestimmte Funktionalität häufiger benötigen und diese auf einfache Art und Weise verwenden sollen. Die Erstellung von Plug-ins erfolgt in zwei Schritten. Zuerst schreiben Sie Methoden und Funktionen, die Sie zur Verfügung stellen wollen. Des Weiteren sollten Sie diese in einer eigenen JavaScript-Datei zur Verfügung stellen, die ein Anwender einbinden muss.
  
  Ein erstes Plug-in erstellen
  
  04:57
- Es gibt ein paar wesentliche Regeln zur Erstellung eines einfachen Plug-ins. In diesem Film fasst der Autor sie zusammen.
  
  Regeln zur Erstellung eines einfachen Plug-ins
  
  02:49
- In diesem Video sehen Sie, wie Sie komplexere, anpassbare Plug-ins erstellen können.
  
  Komplexere Plug-ins
  
  03:10
- Sie sehen einen Twitter-Client als hoch anpassbares Plug-in, bei dem ein Anwender u.a. individuell einstellen kann, welche Hintergrundfarbe, Vordergrundfarbe, Schriftart und Schriftgröße verwendet wird. Ebenso lassen sich Twitter-spezifische Optionen wie der Autor oder die Anzahl der angezeigten Tweeds festlegen.
  
  Ein Twitter-Client als hochanpassbares Plug-in
  
  02:46
- Ein Plug-in können Sie einfach auf den jQuery-Seiten veröffentlichen, wenn Sie dort einen Account anlegen und dann die Eckdaten zu dem Plug-in in einem Webformular eintragen.
  
  Ein Plug-in veröffentlichen
  
  01:55

Das Open-Source-Framework, das mittlerweile auch große Firmen wie Microsoft oder Nokia offiziell supporten, ist einfach faszinierend. jQuery vereinfacht die Programmierung, Erstellung und Optimierung dynamischer, interaktiver Webanwendungen erheblich, stellt aber ein JavaScript-Framework dar, das ein wenig Einarbeitung erfordert. Dies lohnt ob der genialen Möglichkeiten von jQuery auf jeden Fall. Statt sich die vielen Funktionen und Möglichkeiten mühevoll selbst beizubringen, lassen Sie sich einfach von Ralph Steyer einführen!

Aus dem Inhalt:

Grundlagen zu jQuery und seinem Umfeld
In diesem ersten Kapitel stellt Ihnen Ralph Steyer jQuery vor, beginnend bei den Voraussetzungen, über das erste Beispiel bis hin zu den wichtigsten Grundbegriffen.

Wie jQuery grundsätzlich funktioniert
Lernen Sie in diesem Kapitel, wie Sie mit jQuery arbeiten und Objekte und Methoden nutzen.

Mit jQuery bestimmte Bestandteile einer Webseite gezielt auswählen
Wie Sie mit Selektoren und mit Filtern bestimmte Elemente einer Webseite beeinflussen können, ist Inhalt dieses Kapitels.

Mit jQuery und Style Sheets die Bestandteile der Webseite formatieren
Auch auf die CSS-Eigenschaften von Elementen haben Sie mit jQuery Zugriff. Wie das funktioniert, demonstriert Ihnen Ralph Steyer anhand zahlreicher Beispiele.

Mit jQuery die Webseite gezielt verändern und auswerten
Das Hinzufügen von Elementen (Knoten) ist ebenfalls mit jQuery möglich. Ralph Steyer stellt Ihnen hierzu die gebräuchlichsten Methoden vor.

Die Reaktion auf Ereignisse in jQuery
Auch auf Ereignisse haben Sie Zugriff. Mit jQuery gelingt Ihnen dieser fast im Handumdrehen. Mehr dazu in diesem Kapitel.

Animationstechniken in jQuery
Animation leicht gemacht! Sehen Sie in den Filmen dieses Abschnitts, wie Sie solche elegant erstellen können.

Die AJAX-Unterstützung in jQuery
Wie sich AJAX mit jQuery realisieren lässt, ist Inhalt dieses Kapitels. Ralph Steyer zeigt Ihnen diese recht neue Methode, um Daten von entfernten Servern zu holen.

Das Framework für die Oberfläche
Wie Sie jQuery UI, die Oberfläche von jQuery, elegant und sicher verwenden, lernen Sie im vorletzten Abschnitt.

Die Nutzung, Erstellung und Veröffentlichung von jQuery-Plugins
Plugins sind als abschließendes Kapitel an der Reihe. Lassen Sie sich zeigen, wie Sie vorhandene Plugins verwenden, komplexe Plugins einsetzen oder selbst welche registrieren.

Systemvoraussetzungen

512 MB RAM
DVD-Laufwerk
Soundkarte, Lautsprecher bzw. Kopfhörer
Bildschirmauflösung mind. 1024x768
Windows XP/Vista oder Mac OS X
Pentium 4 ab 2,6 GHz oder G5

Tutorial to go

Dank „Tutorial to go“ können Sie ausgewählte Videos auch auf Ihrem iPod, iPhone oder vielen Mobiltelefonen und anderen mobilen Endgeräten abspielen – lernen Sie, wann und wo Sie wollen!

Die Filme finden Sie als Download auf unserer Website bzw. auf der DVD im Verzeichnis /mobile. Einfach überspielen und los geht’s!

Sourcecodes

Der im Rahmen dieses Trainings entstandene Quelltext ist vollständig im Training enthalten. So können Sie die Lektionen optimal von Anfang an nachvollziehen oder an einer beliebigen Stelle quer einsteigen - ohne lästige und fehleranfällige Tipparbeit.

Multiple Choice Tests

Prüfen Sie Ihr Wissen mit den Multiple Choice Tests! So können Sie Erlerntes wiederholen und gleichzeitig Ihr Wissen festigen. Aber Vorsicht: mehr als eine Antwortmöglichkeit kann hier korrekt sein! Eine Frage wird nur dann als richtig gewertet, wenn Sie alle entsprechenden Antworten erkannt haben.

Bonusmagazin

Begleitend zu den Videos bietet dieses Training ein Bonusmagazin mit einem Kurzporträt des Autors bzw. der Autoren, weiterführende Artikel zum Thema, ein ausführliches, reich bebildertes Inhaltsverzeichnis sowie Informationen zur Bedienung des Trainings (nur in der DVD-Version).

Mach mit!-Modus

Sie haben die Wahl! Lernen Sie konzentriert im Vollbildmodus oder schalten Sie mit nur einem Klick in den Mach mit!-Modus. So probieren Sie die Beispiele direkt am eigenen Computer aus, während das Video-Training in einem extra Fenster parallel weiter läuft.

Lesezeichen

Während ein Video läuft können Sie jederzeit individuelle Lesezeichen setzen, die als orange Markierungen in der Abspielleiste auftauchen. Ein Lesezeichen kann aus einem einfachen Begriff oder einer kurzen Notiz bestehen. Eine Übersichtsliste hilft dabei, die eigenen Lesezeichen schnell wieder zu finden.

Derzeit sind keine Feedbacks vorhanden...