Image Rollovers i Adobe CS5 Dreamweaver - dummies

I Adobe Creative Suite 5 (Adobe CS5) Dreamweaver kan du infoga bildobjekt, inklusive bildhållare, överlåtningsbilder (bilder som ändras när en tittare rullar musen över bilden), navigeringsfält, och Fireworks HTML. Du får åtkomst till dessa bildobjekt genom att välja Infoga → Bildobjekt.

1Använd de bilder som ska användas som överlåtelse.

Du kan skapa dessa bilder i Fireworks, Illustrator, Photoshop eller någon annan applikation som kan spara bilder som är optimerade för webben.

2 Placera markören på sidan var du vill att övergången ska visas.

Välj Infoga → Bildobjekt → Rulla bild eller klicka på knappen Rollover Image i Insert-panelen. Dialogrutan Insert Rollover Image.

3Nämn bilden.

Skriv ett bildnamn utan mellanslag i textfältet Bildnamn. Detta namn används i skriptet som skapar övergången.

4Klicka på Browse-knapparna.

Bläddringsknappen är till höger om textfälten Original Image och Rollover Image. Leta reda på den bild som du vill visa som standard på sidan och bilden som bara visas när någon svänger musen över bilden.

5Välj avkryssningsrutan för förladdningsrulla bilden vald.

Detta alternativ hämtar rolloverbilden när sidan laddas ned för att undvika förseningar i rollovers.

6Beskriv bilden.

Skriv lämpligt beskrivande alt-text i Alt-textfältet.

7Fyll i när-klicka, Gå till URL-textfältet.

Detta riktar Dreamweaver där tittare riktas när de klickar på övergångsbilden. Du kan antingen klicka på knappen Bläddra för att hitta en annan sida på din webbplats eller ange en webbadress. Obs! Om du länkar till en annan webbplats måste du inkludera // prefixet i början av webbadressen.

Om du inte har en riktig länk för att använda en knapp eller en hyperlänk kan du ange ett pundtecken (#) för att skapa en död länk. Länken eller knappen visas klickbar men går inte någonstans när den klickas. Det här alternativet är bättre än att trycka på mellanslagstangenten för att skapa ett tomt utrymme som en länk, eftersom det kommer att visa ett fel på sidan Not Found när den klickades.

8Klicka på OK.

Övergångsbilden skapas på sidan.

9Visa bilden.

För att förhandsgranska den nya rollover-bilden, välj Arkiv → Förhandsgranska i webbläsare eller klicka på knappen Live View på dokumentverktygsfältet.