Hvordan lage interaktive Roll Knapper i Imageready

Når du oppgraderer fra Photoshop CS2 til CS3, ikke kaste din gamle versjonen ut ennå. CS3 eliminert muligheten til å gjøre virkelig interaktiv velt på websidene dine. Du kan bygge den interaktive velt med Dreamweaver, eller bla opp for fyrverkeri, eller du kan sende filene tilbake til Photoshop CS2 og bygge dem i løpet av minutter med Imageready.

Bruksanvisning

1 Åpne bildet i Photoshop. Bygg bakgrunnen, knappeformer, grenser og tekst på forskjellige lag. Flytt elementer som aldri endrer til et lag gruppe som heter "Static" og elementene for å endre når markøren ruller over til et lag gruppe som heter "Normal". Disse elementene kan inkludere knappen form, knapp farge eller teksten.

2 Duplisere "Normal" laggruppe og gi den navnet "Rollover." Gjør eventuelle endringer i knappe elementer for å indikere musepekeren har rullet over knappen (rollover effekter trenger ikke å være i samme område av bildet som knappen). Skjule "Rollover" laggruppe.

3 Lag en egen skive for hver knapp. Dobbeltklikk på hver skive med skive utvalg verktøy for å åpne "Slice Options" -vinduet. Navn på knappen og skriver inn knappen URL.

4 Lagre filen og flytte den til Imageready. Velg den første knappen skive og klikk på "Create Roll State" -knappen på bunnen av "Web Content" paletten. En ny roll tilstand som heter "Over" vises på paletten.

5 Velg roll staten forhåndsvisning i "Web Content" paletten. Åpne lagpaletten. Skjule "Normal" laggruppe og vise "Rollover" laggruppe.

6 Gjenta for de andre knappe skiver. Du må vise "Rollover" laggruppe for hver roll stat.

7 Klikk på "Forhåndsvisning i leser" -knappen for å forhåndsvise dokumentet og dobbeltsjekke rollover effekter. Velg "Lagre optimalisert som" fra Fil-menyen. Lagre som HTML og bilder for med "Alle skiver" valgt. Imageready vil generere nettsiden og all koden som trengs for å gjøre velt arbeid.

Hint

  • Åpne CS3-filer i eldre versjoner av Photoshop og Imageready, men den eldre søknaden vil flate noen effekter som er utviklet i senere søknader. Kontrollere hva som skjer ved å flate de enkelte lag og lagre en kopi av arbeidsfila.
  • Skjær bildet i Photoshop eller Imageready; verktøyene fungerer ganske mye det samme.