Operation Manual

Arbeiten mit Spry-Widgets (allgemeine Anweisungen)
Hinweis:
Nach oben
Widget-Struktur
Widget-Verhalten
Widget-Stil
Nach oben
Nach oben
Hinweis:
Nach oben
Spry-Widgets
Spry-Widgets - Ressourcen und Tutorials
Spry-Widget einfügen
Spry-Widget auswählen
Spry-Widget bearbeiten
Stil eines Spry-Widgets festlegen
Weitere Widgets
Standardordner für Spry-Elemente ändern
Spry-Widgets werden ab Dreamweaver CC durch jQuery-Widgets ersetzt. Sie können zwar vorhandene Spry-Widgets auf der Seite
noch ändern, aber Sie können keine neuen Spry-Widgets hinzufügen.
Spry-Widgets
Bei einem Spry-Widget handelt es sich um ein interaktives Seitenelement, das dem Anwender ein höherwertigeres Erlebnis durch
Benutzerinteraktion bietet. Es besteht aus folgenden Elementen:
Ein HTML-Codeblock zur Definition der strukturellen Zusammensetzung des Widgets.
JavaScript zur Steuerung des Widget-Verhaltens bei Benutzeraktionen.
CSS zur Bestimmung des Erscheinungsbilds.
Das Spry-Framework unterstützt einen Satz wiederverwendbarer, in standardmäßigem HTML, CSS und JavaScript geschriebener Widgets. Diese
Widgets lassen sich kinderleicht einfügen (der Code ist einfaches HTML und CSS) und mit eigenem Stil anpassen. Die Verhalten im Framework
beinhalten Funktionen, mit denen Benutzer Seiteninhalte ein- bzw. ausblenden, das Erscheinungsbild (wie die Farbe) ändern oder mit Menüs
interagieren können und vieles mehr.
Alle Widgets im Spry-Framework sind mit eindeutigen CSS- und JavaScript-Dateien verknüpft. Die CSS-Datei enthält alles Notwendige für den
Widget-Stil, während die JavaScript-Datei ihre Funktionalität bestimmt. Wenn Sie ein Widget über die Dreamweaver-Benutzeroberfläche einfügen,
verknüpft Dreamweaver diese Dateien automatisch mit Ihrer Seite. Ihr Widget erhält dadurch Funktionalität und Stil.
Die mit einem Widget verknüpften CSS- und JavaScript-Dateien werden nach dem Widget benannt. So wissen Sie immer, welche Dateien zu
welchem Widget gehören (So heißen die mit dem Akkordeon-Widget verknüpften Dateien folgerichtig „SpryAccordion.css“ und „SpryAccordion.js“).
Wenn Sie ein Widget in eine gespeicherte Seite einfügen, erstellt Dreamweaver einen Ordner mit Namen „SpryAssets“ auf Ihrer Site, in dem die
dazugehörigen JavaScript- und CSS-Dateien gespeichert werden.
Spry-Widgets - Ressourcen und Tutorials
Die folgenden Online-Ressourcen enthalten weiterführende Informationen zum Anpassen von Spry-Widgets.
Spry widget samples (Beispiele für Spry-Widgets)
Customizing Spry Menu Bars in Dreamweaver (Spry-Menüleisten in Dreamweaver anpassen)
Spry Validation widgets (Spry-Überprüfungs-Widgets) - Video-Tutorial
Spry-Widget einfügen
Wählen Sie „Einfügen“ > „Spry“ und dann das einzufügende Widget aus.
Bei diesem Vorgang fügt Dreamweaver beim Speichern der Seite automatisch die benötigten Spry-JavaScript- und -CSS-Dateien hinzu.
Sie können Spry-Widgets auch über die Kategorie „Spry“ im Bedienfeld „Einfügen“ hinzufügen.
Spry-Widget auswählen
1. Zeigen Sie mit dem Mauszeiger auf das Widget. Daraufhin wird sein blau gestrichelter Rahmen angezeigt.
2. Klicken Sie oben links auf das Widget-Register.
368