λογισμικό

* Γνώση Υπολογιστών >> λογισμικό >> Λογισμικό Παραγωγικότητας

Πώς να δημιουργήσετε ένα κουμπί Rollover σε CS2

Adobe Photoshop CS2 και το πρόγραμμα σύντροφος της ImageReady αποτελούν ισχυρά εργαλεία για τους χρήστες που θέλουν να πάρουν μια οπτική προσέγγιση στο Web design . Οι χρήστες μπορούν να δημιουργήσουν JavaScript ανατροπές χωρίς ποτέ να χρειάζεται να επιλέξετε οποιοδήποτε κώδικα συνδυάζοντας τις δυνατότητες γραφικών σχεδιασμό του Photoshop και τη συμπεριφορά καθορισμό των δυνατοτήτων του ImageReady . Το κλειδί για την επιτυχή ανατροπές έγκειται στην κατανόηση στρώματα στο Photoshop . Τα πράγματα που θα χρειαστείτε
Υπολογιστών
λογισμικό Adobe Photoshop CS2

Παρουσίαση Περισσότερες οδηγίες
Δημιουργία Button σας

1

Ανοίξτε το Photoshop και να δημιουργήσετε ένα νέο έγγραφο επιλέγοντας "Αρχείο > Νέο" από το μενού της εφαρμογής . Ρυθμίστε το μέγεθος του εγγράφου σας και κάντε κλικ στο "OK". 2

Επιλέξτε το " Type Tool " από το Tools Panel στα αριστερά του καμβά σας και κάντε κλικ οπουδήποτε πάνω στον καμβά για να δημιουργήσετε κάποιο κείμενο σημείο το κουμπί σας ( «περίπου» ή « χαρτοφυλακίου », για παράδειγμα) . Ορίστε τις επιθυμητές ρυθμίσεις γραμματοσειράς σας στο εργαλείο επιλογές του πίνακα πάνω σε καμβά σας και να πληκτρολογήσετε το κείμενο το κουμπί σας . Μπορείτε να μετακινήσετε αυτό το κείμενο γύρω από μετακινώντας τον κέρσορα μακριά από το ίδιο το κείμενο και , στη συνέχεια, κάνοντας κλικ και σύροντας προς την κατεύθυνση που θέλετε να μετακινήσετε .
Εικόνων 3

Διπλότυπο στρώμα του κειμένου σας, κάνοντας κλικ και σύροντας το στο εικονίδιο " Create New Layer" στο " Layers" παλέτα στα δεξιά του καμβά σας . Το εικονίδιο μοιάζει με ένα τετράγωνο , τσακισμένες σελίδα .
Η

4 Επιλέξτε το "αντίγραφο " στρώμα που μόλις δημιουργήσατε και κάντε δεξί κλικ ( Ctrl + κλικ σε Mac ) στον τίτλο στρώμα στο " Layers " παλέτα . Επιλέξτε " Επιλογές ανάμειξης " από το μενού που προκύπτει flyout . Αυτό θα ανοίξει ένα " Layer Style" παράθυρο διαλόγου .
5

Κάντε κλικ στη λέξη " Drop σκιά " στη στήλη " Στυλ " στα αριστερά του πλαισίου διαλόγου . Κάντε κλικ στο "Προεπισκόπηση " κουτάκι στα δεξιά του πλαισίου διαλόγου και να προσαρμόσετε τις ρυθμίσεις της σκιάς πτώσης, όπως είναι επιθυμητό .
Εικόνων Ρύθμιση ανατροπές σε ImageReady
Η 6

Επιλέξτε το ImageReady icon στο κάτω μέρος του πάνελ Tools . Αυτό εγκαινιάζει ένα ξεχωριστό πρόγραμμα από το Photoshop που έρχεται με αυτό για τη βελτιστοποίηση εικόνων του Photoshop για το Web .
Η

7 Επιλέξτε το " Tool φέτα " από τον Πίνακα Tools στο αριστερό μέρος της οθόνης σας και κάντε κλικ και σύρετε το φέτα γύρω από το κουμπί σας από την κορυφή αριστερά προς τα κάτω δεξιά .
8

Επιλέξτε την παλέτα "Web Content " στο δεξί μέρος της οθόνης σας και κάντε κλικ στο κουμπί σας .
Η 9

ποντίκι κάτω στο "Layers " παλέτα , όπου εμφανίζονται τα διαφορετικά στρώματα του κουμπιού σας . Κάντε κλικ στο εικονίδιο ματιού δίπλα στο άνω στρώμα , το οποίο περιέχει τη σκιά πτώση του κουμπιού σας . Αυτό θα απενεργοποιήσει την προβολή αυτού του στρώματος , έτσι ώστε μόνο η μη - σταγόνα σκιά έκδοση του κουμπιού σας εμφανίζεται στην ιστοσελίδα σας , όταν το ποντίκι δεν πλανάται πάνω από αυτό .
Η 10

Επιστροφή στο "Web περιεχόμενο " παλέτα και κάντε κλικ στο εικονίδιο σελίδας τσακισμένες στο κάτω μέρος για να δημιουργήσει μια νέα κατάσταση ανατροπής . Η λέξη " πάνω " θα εμφανιστεί δίπλα στο νέο κράτος , πράγμα που σημαίνει ότι η εμφάνιση που θα επιλέξετε για αυτό θα εμφανιστεί όταν το ποντίκι αιωρείται πάνω στην ιστοσελίδα σας .
Η 11

Επιστροφή στο "Layers " παλέτα και να απενεργοποιήσετε την προβολή της μη -drop στρώμα σκιά κάνοντας κλικ στο εικονίδιο ματιού προς τα αριστερά . Ενεργοποιήστε την προβολή της σκιάς πτώσης στρώμα .
Εικόνων σύνδεση Rollover σας

12

Επιλέξτε " Παράθυρο > Φέτα " για να εμφανιστεί η " Φέτα " παλέτα στα δεξιά του οθόνη σας . Επιλέξτε αυτήν την παλέτα .
Η 13

Πληκτρολογήστε ένα όνομα για το κουμπί σας στο πεδίο "Όνομα" και εισαγάγετε μια διεύθυνση URL για το rollover σας να συνδεθούν όταν οι χρήστες κάνουν κλικ πάνω του .
Η 14

Επιλέξτε " Αρχείο> Αποθήκευση Optimized ως" από το μενού της εφαρμογής και να δημιουργήσει ένα όνομα για το rollover σας . Επιλέξτε " HTML και εικόνες " από το " Format " και κάντε κλικ στο αναπτυσσόμενο μενού "Αποθήκευση" .
Η
εικόνων

Συναφής σύστασή

Πνευματικά δικαιώματα © Γνώση Υπολογιστών Όλα τα δικαιώματα κατοχυρωμένα