-
- hur man skapar rollovers i Photoshop
- Postad av:Magnus Ekblad
- En rollover-knapp är en knapp på webbplats som ändrar sitt tillstånd när musen svävar över den. Staten förändring kan vara valfritt antal förändringar inklusive färg, teckensnitt, storlek eller en kombination av dessa. Rollover knappar finputsa och professionalism på din webbplats och kan skapas lätt i Adobe Photoshop och ImageReady. Dessa steg detalj hur man skapar en enkel rollover knapp, men processen kan ändras för mer stiliserad grafik
Du behöver:. .
Adobe Photoshop
ImageReady.
Skapa Button bilder i Photoshop
1.
Gå till Arkiv> Ny och ange bildstorlek till 80 av 25 pixlar med en upplösning på 72 pixlar per tum.
2.
Klicka på förgrundsfärgen färgrutan nära botten på verktygspaletten på höger sida av skärmen. Välj en färg för texten på knappen. Klicka sedan på bakgrunden färgrutan och välja en färg.
3.
Tryck på "" Control + Backspace för att fylla bildytan med din valda bakgrundsfärg.
4.
Välj "Typ" verktyget från verktygspaletten och ställ in teckensnitt och storlek i verktygsmenyn längst upp på skärmen. Klicka på dokumentet område och typ knappen namn, t. ex. "Portfolio" eller "Hem".
5.
Använd "Flytta" verktyg för att anpassa texten som du vill.
6.
Kopiera både bakgrund och textlager. Skapa en kopia av ett lager genom att högerklicka på ett lager i lager paletten och välja "Duplicera".
7.
Koppla den ursprungliga bakgrund och lager text genom att hålla "Shift" tangenten medan du klickar båda lagren i lagerpaletten. Gå sedan till menyn Redigera> Lägg samman lager. Byt namn på lagret "normala tillståndet. "
8.
Dubbelklicka på" T "bild till vänster om den kopierade textlager för att markera texten. Klicka på färgrutan i verktygsmenyn längst upp på skärmen och välj en annan färg för texten när musen svävar över knappen.
9.
byta färg på bakgrundslagret, om så önskas.
10 .
slå samman de två kopierade lager och döp lagret Filen ska nu innehålla två lager "Rollover staten. ": "Normal staten" lager på botten och "Rollover staten" överst. Du kan förhandsgranska hur knappen Change kommer att se ut genom att vrida synlighet det översta lagret på och av. Klicka på ögat bilden till vänster om lagret för att visa eller dölja den.
Skapa rollover-knappen i ImageReady
1.
Klicka på "Gå till ImageReady "knappen längst ner på verktygspaletten med din knapp filen fortfarande öppen.
2.
Gå till utseendet paletten (i CS eller nyare) eller välta paletten (i äldre versioner) , om det inte redan är öppen, gå till menyn Fönster och välj paletten från rullgardinsmenyn.
3
Göm "Rollover stat" lagret. Detta kommer att ställa det normala tillståndet för en knapp till "Normal" lager
4
<. . br> Klicka på "Skapa ny stat" längst ned på "Utseende" eller "Rollover" palett. Slå på synlighet på "Rollover staten" layer att använda den som den välta staten
5
Gå till slice paletten. . Om den inte redan är öppet kan det vara finns i menyn Fönster. Tilldela en webbadress till din rollover knapp, detta är den webbsida användaren ska vidtas för att när han klickar på din knapp.
6.
Testa din rollover knapp genom att klicka på "Förhandsgranska i standardwebbläsare"-knappen längst ned på verktygspaletten.
7.
Gå till Arkiv> Spara optimerad för att spara HTML-fil och bildmapp.
tips och varningar
- Här beskrivs stegen som leder dig genom processen att skapa en enkel rollover knapp, men du kan göra normala och rollover-bilder lika utarbeta som du vill.
Relaterade artiklar
adobe 4 Systemkrav för Mac
Hur beskära bilder till cirklar
hur säkra trådlösa internet: enkel steg-för-steg-instruktioner
hur man hittar en bild Yahoo profil med e-post
Hur kan jag avaktivera Websense?
datoriserade inventering kontrollförfaranden
hur man återhämta sig från en fast bios uppgradering
hur man hittar virus i mitt register
hur man kan stoppa ups uTorrent pop
hur man arbetar med Adobe Photoshop nycklar chroma