KAKO DA kreirate padajuće menije u Fireworksu 8

U ovoj vežbi naučićete kako u Fireworksu 8 možete da kreirate padajuće menije profesionalnog izgleda. Ove padajuće menije možete da upotrebite za brzo i lako kreiranje atraktivnih horizontalnih i vertikalnih navigacionih linija u vašem web sajtu, ili web sajtovima. 

Napomena: Da biste implementirali Fireworksove padajuće menije potreban vam je Dreamweaver i osnovno poznavanje rada u ovom programu.

Samo kreiranje padajućih menija u Fireworksu 8 je veoma lako. Pratite sledeće korake:

1. Kreirajte sliku/dugme koje biste želeli da upotrebite kao prvo dugme padajućeg menija. Klikom na ovo dugme otvoriće se padajući meni sa dodatnim stavkama, pri čemu svaka stavka (iliti dugme) vodi na drugu web stranicu.

2. Sada treba da kreirate isečak slike tako što ćete u liniji menija izabrati Edit>Insert>Rectangular Slice (Alt+Shift+U). Preko dugmeta će se pojaviti svetlozeleni isečak. Kliknite desnim tasterom miša na isečak. U padajućem meniju koji će se otvoriti izaberite komandu Add Pop-Up Menu. Otvoriće se Pop-up Menu Editor okvir za dijalog.

3. Na kartici Content dvostruko kliknite na prazno tekstualno polje u Text koloni. Zatim ukucajte ime za stavku menija (na primer, Website Design).

4. Klikćite na simbol ’+’ da biste dodali još stavki menija. Zatim unesite ima za svaku stavku menija.

5. Kada ste završili kliknite na Next, da biste bili prebačeni na Appearance karticu.

6. Na Appearance kartici izaberite sledeća podešavanja:

• U području Cells potvrdite opciju HTML.
• U padajućem meniju sa desne strane izaberite da li želite vertikalni (Vertical Menu) ili horizontalni (Horizontal Menu) padajući meni.
• U padajućem meniju Font izaberite grupu fontova koju želite da upotrebite za tekst dugmadi. Ja sam izabrao Verdana, Arial, Helvetica, sans-serif.
• U padajućem meniju Size odredite veličinu fonta. Desno od padajućeg menija Size nalazi se pet ikona za formatiranje teksta menija: podebljana slova (dugme sa slovom B), iskošena slova (dugme sa slovom I) i tri ikone za poravnanje treksta (levo poravnanje, centrirani tekst i desno poravnanje.
• U području Up state odredite boju teksta (Text) i boju ćelija (Cell) tako što ćete kliknuti na njihove uzorke boja i u Color pickeru koji će se otvoriti izabrati boje koje želite. Isto to uradite u području Over state.

Napomena: Up state definiše izgled dugmeta kada se otvori padajući meni, a Over state definiše izgled dugmeta kada se miš postavi na dugme.  

7. Kliknite na Next. Bićete prebačeni na Advanced karticu na kojoj možete da specifikujete sledeća podešavanja:

• Cell width – odredite širinu ćelija padajućeg menija
• Cell height – odredite visinu ćelija padajućeg menija
• Cell padding – odredite razmak između ivice ćelije i teksta
• Cell spacing – odredite razmak između ćelija
• Text indent – definišite uvučenost teksta
• Menu delay – odredite kolika da bude stanka između trenutka kada postavite miša na dugme i trenutka kada se meni otvori
• Show borders – potvrdite ako želite da dugmad imaju okvirne linije
• Border width – odredite širinu okvirne linije ćelija
• Border color - odredite boju okvirne linije
• Shadow – definišite boju senke dugmadi
• Highlight – definišite boju odsjaja dugmadi

8. Kliknite ponovo na Next. Otvoriće se Position kartica. Na ovoj kartici određujete gde želite da se pojavi padajući meni i to pomoću sledećih ikona:

• Prva ikona – postavite padajući meni u donji desni ugao isečka
• Druga ikona – postavite padajući meni u dno isečka
• Treća ikona – postavite padajući meni u vrh isečka
• četvrta ikona – postavite padajući meni u gornji desni ugao isečka

9. Kada ste završili, kliknite na Done. Padajući meni je spreman za upotrebu

10. U liniji menija izaberite File/Preview in Browser. Videćete da se padajući meni pojavljuje na definisanoj poziciji kada pređete mišem preko njega.

11. Da biste mogli da upotrebite Fireworks padajući meni u vašem web sajtu treba da ga eksportujete. U suprotnom nećete moći da ga implementirate pomoću Dreamweavera. Zato u liniji menija izaberite File/Export. U Export okviru za dijalog izaberite sledeća podešavanja:

• U padajućem meniju Save in izaberite lokaciju gde hoćete da snimite fajlove i slike.
• U tekstualno polje File name upišite naziv za padajući meni.
• U tekstualnom polju Export izaberite HTML and images.
• Na kraju kliknite na Export i sve što je potrebno za nesmetani rad Fireworks 8 padajućeg menija će biti eksportovano. 

12. Otvorite direktorijum gde ste snimili fajlove i otkrićete da Fireworks 8 kreira fajl koji se zove mm_menu.js. Ovaj fajl sadrži kod za padajuće menije.