Hvordan lage Mouse Over animasjon på Dreamweaver

Hvordan lage Mouse Over animasjon på Dreamweaver


Før musepekeren over animasjoner, også kjent som velt, endre utseendet på en grafisk, vanligvis en knapp på en webside når brukeren svever hennes musepekeren over grafikken. Denne effekten er vanligvis laget med to versjoner av det grafiske - Up-state versjon som er den normale knappen staten og den Over-state-versjon som vises når markøren holdes over bildet. Du kan opprette velt i Adobe Dreamweaver, en web-side design program, med programmets Roll bilde-funksjonen.

Bruksanvisning

1 Åpne Dreamweaver HTML-fil som inneholder bildet du ønsker å lage en rollover eller starte en ny HTML-side ved å klikke på "File" -menyen og velge "New". Dette åpner dialogboksen Nytt dokument. Velg "HTML" fra Type-listen, og ønsket layout fra Layout-listen, og klikk deretter på "Create" -knappen.

2 Klikk på "File" -menyen og velg "Lagre som". Dette åpner dialogboksen Lagre som. Navn og lagre siden.

3 Klikk på siden der du vil opprette en velt.

4 Klikk på "Insert" -menyen, velg "Bilde Objects, velg deretter" Rollover Image "fra fly ut menyen. Dette åpner dialogen bilde Sett inn Roll boksen.

5 Klikk på "Browse" -knappen ved siden av "originalbilde" -feltet. Dette åpner Original dialogboksen Bilde boks. Naviger til Up-state grafikk, velger det, velg deretter "OK".

Du kan lage din grafikk opp og over i et grafikkprogram som Adobe Photoshop eller du kan laste button-statlige parene fra en av flere sider på Internett som tilbyr gratis knappen grafikk.

6 Klikk på "Browse" -knappen ved siden av "Rollover Image" feltet. Dette åpner dialogen Bilde roll boksen. Naviger til Over-stat grafikk, velger det, velg deretter "OK".

7 Skriv inn URL for denne knappen i "når du klikker på, Gå til URL" -feltet. Dette er websiden du ønsker å laste når brukeren klikker på knappen.

8 Klikk på "Live View" -knappen under menylinjen. Slå på Live View kan du teste roll.

9 Holder musepekeren over grafikken for å se musen-over effekt.

Hint

  • Når du laster opp denne nettsiden til en webserver ikke glem å laste opp både bilder. Ellers din rollover effekten vil ikke fungere.