jQuery von Kopf bis Fuß (German Edition)

können Sie das gleich ausprobieren.
    Spitzen Sie Ihren Bleistift
    Ergänzen Sie den jQuery-Code für die Eingabe des Breiten- und Längengrades. Der Bereich des Schiebereglers für den Breitengrad soll zwischen -90 und 90 liegen. Das Intervall soll 0,00001 betragen. Der Wertebereich des Schiebereglers für den Längengrad soll zwischen -180 und 180 liegen, das Intervall bei 0,00001.
    Spitzen Sie Ihren Bleistift: Lösung
    Ergänzen Sie den jQuery-Code für die Eingabe des Breiten- und Längengrades. Der Bereich des Schiebereglers für den Breitengrad soll zwischen -90 und 90 liegen. Das Intervall soll 0,00001 betragen. Der Wertebereich des Schiebereglers für den Längengrad soll zwischen -180 und 180 liegen, das Intervall bei 0,00001.
    Damit haben Sie schon eine Reihe von Punkten auf der Checkliste abgehakt.
    1.
Das Datum einer Sichtung soll mithilfe eines grafischen Kalender-Widgets ausgewählt werden können.
2.
Gestalten Sie ansprechendere Radio-Buttons, mit denen die Art der Kreatur ausgewählt werden kann.
3.
Erstellen Sie eine Reihe von Schiebereglern zur Eingabe der Entfernung von der Kreatur, ihres Gewichts, ihrer Höhe und des Längen- und Breitengrades.
    Was kommt jetzt? Der nächste Schritt besteht darin, den Kryptozoologen eine Möglichkeit zu schaffen, anhand von Schiebereglern die Farbe der gesichteten Kreatur einzugeben. Es soll jeweils einen Regler für die Farben Rot, Grün und Blau geben.
    4.
Erstellen Sie einen Farbmischer für die Eingabe der Farbe der Kreatur.

Computer mischen Farben aus Rot, Grün und Blau
    Die Werte für Rot, Grün und Blau haben ein Minimum von 0 und einen Maximalwert von 255. Haben alle Farben den Minimalwert 0, erhalten Sie Schwarz. Stehen alle Farben auf dem Maximalwert 255, ist das Ergebnis Weiß.

Ihre Schieberegler sollen das auch tun
    Es werden also drei verschiedene Schieberegler gebraucht: einer für Rot, einer für Grün und einer für Blau. Danach kombinieren Sie die Werte der einzelnen Schieber, um daraus die Farbe zu mischen. Wir wollen sehen, welche Funktionen dafür nötig sind.

    Code-Fertiggericht
    Fügen Sie den hervorgehobenen Code in die Dateien sichtungen_end.html und form.css ein. Damit werden sie für die Darstellung vorbereitet.
    Spitzen Sie Ihren Bleistift
    Das Skript unten richtet die Schieberegler für die Farben Rot, Grün und Blau ein. Lesen Sie die einzelnen Zeilen und überlegen Sie sich auf Grundlage Ihres Wissens über jQuery und jQuery UI, was hier getan werden muss. Danach schreiben Sie auf, was der Code Ihrer Meinung nach tut. Wenn Sie sich bei einer Zeile nicht ganz sicher sind, ist es vollkommen okay, auch mal zu raten. Eine Zeile haben wir schon für Sie erledigt.
    Es gibt keine: Dummen Fragen
    F:
F: Warum liegt jQuery UI so viel CSS-Code bei?
A:
A: Das Tolle an jQuery UI ist, dass die Entwickler bereits die komplexen CSS-Stile für Sie geschrieben haben. Sie müssen es also nicht mehr selbst tun. Weitere Informationen zu CSS finden Sie in der CSS-Datei für das jQuery UI-Paket unter jquery-ui-1.8.18.custom/css/sunny/jquery-ui-1.8.18.custom.css . Mehr über die CSS-Klassen finden Sie in der jQuery UI-Dokumentation unter http://jqueryui.com/docs/Theming/API .
F:
F: Sie haben gesagt, ich kann auch mein eigenes Theme für jQuery UI schreiben. Wie geht das?
A:
A: Am einfachsten können Sie dafür den Themengenerator (»theme roller«) von jQuery UI verwenden. Rufen Sie dafür zunächst die folgende Adresse in Ihrem Browser auf:
    http://jqueryui.com/themeroller/
    Danach klicken Sie auf den Tab »Roll your own«. Hier können Sie eigene Schriften, Farben, Schattenwüfe und Vieles mehr definieren. Ihre Änderungen werden sofort auf die verschiedenen UI-Elemente übertragen.
    Hat das Theme das gewünschte Aussehen, klicken Sie einfach auf den Button »Download Theme«. Sie werden dann auf die Seite »Build Your Download« weitergeleitet, auf der Sie sich Ihr eigenes jQuery UI-Paket zusammenstellen können. Wenn Sie das Theme später weiterbearbeiten wollen, legen Sie einfach ein Lesezeichen für die Seite »Build Your Download« an.
F:
F: Ich verstehe die Interaktions-Widgets nicht. Wofür kann ich die verwenden?
A:
A: Mithilfe von Interaktionen können Sie interaktive Funktionen erstellen, die man sonst nur in Desktop-Applikationen findet. Mithilfe der Widgets aus der Kategorie Draggable können Sie beispielsweise dafür sorgen, dass Elemente durch Ziehen und Loslassen (»Drag and Drop«) bewegt werden können.
    Anhand der Kategorie Droppable