A rollover -knappen er en knapp på nettsiden som endrer tilstand når musen holdes over den . Staten endringen kan være en rekke endringer, inkludert farge, font, størrelse eller en kombinasjon av disse. Rollover-knapper finpusse og profesjonalitet til nettstedet ditt, og kan lages enkelt i Adobe Photoshop og ImageReady . Disse trinnene detalj hvordan å lage en enkel rollover -knappen , men prosessen kan bli endret for mer stiliserte grafikk. Du trenger
Adobe Photoshop
ImageReady
Vis flere instruksjoner
gi knappen Bilder i Photoshop
en

Gå til Fil> Ny og angi bildestørrelsen til 80 av 25 piksler med en oppløsning på 72 piksler per tomme .
2

Klikk på forgrunnen fargepaletten nederst på verktøypaletten på høyre side av skjermen . Velg en farge for teksten på knappen din . Klikk deretter på bakgrunn fargekartet og velg en farge .
3

Trykk " " Ctrl + Backspace for å fylle bildet med den valgte bakgrunnsfargen .
4

Velg "Type " verktøy fra verktøypaletten , og sett skriften og størrelsen i verktøymenyen øverst på skjermen. Klikk på dokumentet området og skriv inn navnet på knappen , slik som "Portfolio " eller " Home".
5

Bruk " Move "-verktøyet til å justere teksten til din smak.

6

Kopier både bakgrunnen og type lag . Lag en kopi av et lag ved å høyreklikke på et lag i lag paletten og velge " Kopier ".
7

Flett den opprinnelige bakgrunn og tekst lag ved å holde " Shift "-tasten mens du klikker både lag i lagpaletten . Deretter går du til Edit > Merge Layers . Endre navn på lag " Normal State . "
8

Dobbeltklikk på " T" bildet til venstre for den kopierte typen laget for å markere teksten . Klikk på fargekartet i verktøy -menyen øverst på skjermen , og velge en annen farge for teksten når musen holdes over knappen .
9

Endre fargen i bakgrunnen laget, hvis ønsket.
10

Slå sammen de to kopierte lagene , og endre navn på lag " Rollover State . " Filen skal nå inneholde to lag: " Normal State " lag på bunnen og " Rollover State " lag på toppen . Du kan forhåndsvise hvordan knappen endringen vil se ved å slå synligheten av det øverste laget av og på. Klikk på øyet grafikken til venstre for laget til å vise eller skjule den .
Opprett Rollover Button i ImageReady
11

Klikk på " Gå til ImageReady "-knappen . nederst på verktøypaletten med knapp filen fortsatt åpen
12

Gå til utseendet paletten ( i CS eller nyere ) eller rollover paletten ( i eldre versjoner ), hvis det ikke er allerede åpne , gå til Window -menyen og velg paletten fra drop -down menyen
13

Skjul " Rollover State " lag ; . dette vil sette normal tilstand av knappen din til " normal" lag .
14

Klikk på " Create New State "-ikonet på bunnen av " utseende" eller " rollover " palett . Slå på synlighet på " Rollover State " lag for å angi det som overrullingstilstand
15

Gå til stykket palett ; . Hvis det ikke allerede er åpen , kan det bli funnet i Window menyen . Tilordne en URL til din rollover -knappen , dette er nettsiden brukeren vil bli tatt til når han klikker på knappen din
16

Test din rollover -knappen ved å klikke på "Forhåndsvisning i Standard Browser "-knappen . nær bunnen av verktøypaletten .
17

Gå til Fil > Lagre Optimalisert for å lagre HTML-fil og bildemappen.