Adobe Photoshop CS2 und seine ImageReady Begleitprogramm sind leistungsfähige Werkzeuge für Anwender, die eine visuelle Annäherung an Web-Design nehmen wollen. Benutzer können JavaScript -Rollover , ohne jemals irgendeinen Code durch die Kombination der Grafik -Design-Funktionen von Photoshop und das Verhalten Einstellung Fähigkeiten geben ImageReady erstellen. Der Schlüssel zum erfolgreichen Rollover liegt im Verständnis Ebenen in Photoshop . Things You
Computer Adobe Photoshop CS2
brauchen anzeigen Weitere Anweisungen
Erstellen Knopf
1
Öffnen Sie Photoshop und erstellen Sie ein neues Dokument, indem Sie " Datei> Neu" aus dem Menü . Legen Sie die Größe des Dokuments und klicken Sie auf "OK".
2
Wählen Sie den " Text-Werkzeug " aus dem Werkzeug-Bedienfeld auf der linken Seite der Leinwand und auf eine beliebige Stelle auf der Leinwand, irgendwann für Text erstellen Ihre Taste (" etwa" oder " Portfolio", zum Beispiel). Stellen Sie Ihre gewünschte Schriftart Einstellungen im Tool Optionentafel über Ihre Leinwand und geben Sie Ihre Schaltfläche Text. Sie können diesen Text zu bewegen , indem Sie den Cursor weg vom Text selbst und dann Anklicken und Ziehen in die gewünschte Richtung zu bewegen.
3
Duplizieren Sie Ihre Textebene durch Klicken und Ziehen es um die " Neue Ebene erstellen "-Symbol im "Ebenen" -Palette auf der rechten Seite der Leinwand . Das Symbol sieht aus wie ein Quadrat, Eselsohren Seite .
4
Wählen Sie die " Kopie " Schicht Sie gerade erstellt und mit der rechten Maustaste (Ctrl + Klick auf einen Mac) auf den Titel in der Schicht " Layers " Palette. Wählen Sie " Blending Options" aus dem resultierenden Aufklappmenü . Es öffnet sich ein "Layer Style" Dialog .
5
Klicken Sie auf das Wort "Drop Shadow" in der "Styles "-Spalte auf der linken Seite der Dialogbox . Klicken Sie auf die " Vorschau "-Checkbox auf der rechten Seite der Dialogbox und passen Sie die Einstellungen der Schatten , wie gewünscht.
Setting Rollover in ImageReady
6
Wählen Sie das ImageReady Icon am unteren Rand des Bedienfelds Werkzeuge . Dadurch wird ein separates Programm von Photoshop , die mit ihm kommt , um Photoshop-Bilder für das Web zu optimieren.
7
Wählen Sie den " Slice-Werkzeug " aus dem Werkzeug-Bedienfeld an der linken Seite des Bildschirms und klicken und ziehen Sie ein Scheibe um Ihre Schaltfläche von oben links nach unten rechts .
8
Wählen Sie den "Web Content" -Palette auf der rechten Seite des Bildschirms und klicken Sie auf den Button aus.
9
Maus auf der "Layers " Palette , wo die verschiedenen Schichten der Schaltfläche angezeigt. Klicken Sie auf das Augen-Symbol neben der obersten Schicht , der die Schatten der Schaltfläche enthält . Dies schaltet die Sichtbarkeit dieser Schicht , so dass nur die nicht- Schatten -Version Ihres Taste auf Ihrer Web -Seite wird angezeigt, wenn die Maus nicht schwebt über ihm.
10
zurück zur "Web Content " -Palette und klicken Sie auf die Eselsohren Seite Symbol am unteren Rand , um eine neue Rollover-Status erstellen. Das Wort " über " wird neben dem neuen Staat , was bedeutet, dass das Aussehen , die Sie für diese angezeigt wird , wenn die Maus darüber schwebt auf Ihrer Webseite werden kann.
11
Zurück nach erscheinen "Layers " Palette und schalten Sie die Sichtbarkeit des Non-Drop- Schatten-Ebene durch einen Klick auf das Auge-Symbol auf der linken Seite . Schalten Sie die Sichtbarkeit der Schlagschatten Schicht .
Linking Ihre Rollover
12
Wählen Sie " Fenster> Slice" , um den " Slice" -Palette auf der rechten Seite angezeigt Ihrem Bildschirm. Wählen Sie diese Palette.
13
Geben Sie einen Namen für die Schaltfläche im Feld "Name" und geben Sie eine URL -Adresse für den Rollover zu , wenn die Leute darauf klicken verknüpfen.
14
Wählen Sie " Datei> Speichern Optimiert As" aus dem Menü , und erstellen Sie einen Namen für Ihre Rollover . Wählen Sie " HTML und Bilder " aus dem "Format" Dropdown und klicken auf " Speichern".
