Dreamweaver olajša ustvarjanje spustnih menijev za vaše spletno mesto. Ampak kot vse oblike HTML, so lahko nekoliko zapletene. Ta vadnica vas bo vodila skozi korake za ustvarjanje spustnega menija v programu Dreamweaver.
Dreamweaver skokov menije
Dreamweaver 8 ponuja tudi čarovnika za ustvarjanje skokovega menija za navigacijo na vaši spletni strani. V nasprotju z osnovnimi spustnimi meniji bo ta meni dejansko naredil nekaj, ko boste končali. Ni vam treba pisati nobenega JavaScripta ali CGI, da bi vaš obrazec za spuščanje deloval. Ta vadnica prav tako razlaga, kako uporabiti čarovnika Dreamweaver 8, da ustvarite preskokni meni.
Najprej ustvarite obrazec
Pomembno obvestilo o oblikah HTML in Dreamweaver:
Razen posebnih čarovnikov, kot je skok menu, Dreamweaver vam ne pomaga, da oblikujete HTML "delo". Za to potrebujete CGI ali JavaScript. Oglejte si moj vadnik Oblikovanje obrazcev HTML za več informacij.
Ko dodate spustni meni na svojo spletno stran, je prva stvar, ki jo potrebujete, oblika, ki jo obdaja. V programu Dreamweaver pojdite v meni »Vstavi« in kliknite Obrazec, nato izberite »Obrazec«.
02 od 20Oblike prikaza v pogledu oblikovanja
Dreamweaver vizualno prikaže vašo obliko v oblikovnem pogledu, tako da boste vedeli, kam želite vstaviti elemente obrazca. To je pomembno, ker spustne menijske oznake niso veljavne (in ne bodo delovale) zunaj elementa obrazca. Kot je prikazano na sliki, je obrazec rdeča črtasto črto v pogledu oblikovanja.
03 od 20Izberite Seznam / Meni
Spustni meniji se v Dreamweaveru imenujejo elementi »seznam« ali »menu«. Če želite dodati eno v svojo obliko, morate v meniju Vstavi v meni »Vstavi« in izbrati »Seznam / meni«. Prepričajte se, da je bil vaš kazalec v rdeči pikčastem vrstičku polja obrazca.
04 od 20Okno posebnih možnosti
V možnostih Dreamweaver je na voljo zaslon za dostopnost. Izbral sem, da mi Dreamweaver pokaže vse lastnosti dostopnosti. In ta zaslon je rezultat tega. Obrazci so kraj, kjer mnoge spletne strani padejo v dostopnost in tako, da izpolnite te pet možnosti, bodo vaši spustni meniji takoj dostopnejši.
05 od 20Dostopnost obrazca
Možnosti dostopnosti so:
Oznaka
To je ime za polje. Prikazal se bo kot besedilo poleg elementa obrazca.Vpišite, za kaj želite poklicati spustni meni. To je lahko vprašanje ali kratek stavek, na katerega bo odgovoril spustni meni. HTML vsebuje oznako nalepke, ki označuje nalepke obrazca v brskalniku. Vaše izbire morajo obdržati spustni meni in besedilo nalepke z oznako, uporabiti atribut »za« na oznaki nalepke, da ugotovite, na katero oznako se nanaša oznaka, ali da sploh ne uporabite oznake oznake.Raje uporabljam atribut za, tako da, če moram zaradi nekega razloga premakniti oznako, bo še vedno pritrjen na pravilno polje obrazca. Oznako lahko postavite pred ali po spustnem meniju. To je ključ, ki ga lahko uporabite skupaj s tipkami Alt ali Option, če želite priti neposredno v to polje obrazca. Zaradi tega so vaše oblike zelo enostavne za uporabo brez potrebe po miški. To je vrstni red, v katerem mora biti polje za obliko dostopno, če uporabljate tipkovnico na kartici prek spletne strani. Ko posodobite možnosti za dostop, kliknite V redu. Ko spustnem meniju prikažete v pogledu oblikovanja Dreamweaver, mu morate dodati različne elemente. Najprej izberite spustni meni, tako da ga kliknete. Dreamweaver bo postavil še eno pikčasto vrstico okoli spustnega menija in pokazal, da ste ga izbrali. Meni lastnosti se bo v spustnem meniju spremenil v seznam lastnosti / menija. Tam lahko svojemu meniju doda ID (kjer piše "izberite"), odloči, ali želite, da je lis ali meni, mu dajte razred sloga iz vašega slogovnega lista in dodelite vrednosti spustnem meniju. Dreamweaver v spustnem meniju v meniju spusti vse spustne možnosti, ki dovoljujejo samo en izbor. »Seznam« omogoča spustitev več možnosti in je lahko več kot en element. Če želite, da je spustni meni z več vrsticami, ga spremenite v "seznam" in pustite polje »Izbori« nepreverjeno. Če želite v svoj meni dodati nove predmete, kliknite gumb "Seznam vrednosti …". To bo odprlo zgornje okno. V prvo polje vnesite oznako elementa. To bo tisto, kar se bo prikazalo na strani. Če pustite vrednost prazno, se tudi tisto, kar bo poslano v obrazcu. Kliknite ikono plus, če želite dodati več elementov. Če jih želite ponovno naročiti v seznamu, uporabite puščice navzgor in navzdol na desni. Kot sem omenil v 8. koraku, če pustite vrednost prazno, bo oznaka poslana na obrazec. Ampak lahko podarite vse svoje postavke vrednosti - pošljite nadomestne podatke v obrazec. Veliko ga boste uporabili za stvari, kot so meniji za skok in hiperpovezava. Privzete spletne strani privzeto prikazujejo kateri koli element, ki se spusti, je najprej naveden kot privzeti element. Toda, če želite izbrati drugo, jo označite v polju »Začetno izbrano« v meniju »Lastnosti«. Ko končate urejanje lastnosti, bo Dreamweaver prikazoval vaš spustni seznam s privzeto izbrano vrednostjo. Če preklopite na pogled kode, lahko vidite, da Dreamweaver dodaja svoj spustni meni z zelo čisto kodo. Edini dodatni atributi so tisti, ki smo jih dodali z možnostmi dostopnosti. Koda je vsa razčlenjena in zelo enostavna za branje in razumevanje. Celo postavlja v izbrani atribut "izbrani", ker sem povedal Dreamweaver, da privzamem pisanje XHTML. Če dokument shranite in ga pregledate v spletnem brskalniku, lahko vidite, da vaš spustni meni izgleda tako, kot bi pričakovali. Meni, ki smo ga ustvarili zgoraj, je v redu, vendar nič ne naredi. Če želite nekaj storiti, morate na sami obliki nastaviti deformacijsko obliko. Na srečo ima Dreamweaver vgrajeno obliko spustnega menija, ki ga lahko takoj uporabite na svojem spletnem mestu, ne da bi se morali učiti o oblikah, CGI-jih ali skripti. Imenuje se Jump Menu. Meni skokov Dreamweaver nastavi spustni meni z imeni in URL-ji. Potem lahko izberete element v meniju in spletno stran se premakne na to mesto, tako kot če bi kliknili povezavo. Pojdite v meni »Vstavi« in izberite Obrazec in nato »Skok«. Za razliko od standardnega spustnega menija, meni »Skok« odpre novo okno, s katerim lahko poimenujete elemente menija in dodate podrobnosti o tem, kako naj obrazec deluje. Za prvi element spremenite besedilo "untitled1" na to, kar želite prebrati, in dodajte URL, na katerega naj se ta povezava obišče. Kliknite na dodati element, da v menijski skok dodate nov element. Dodajte čim več predmetov, kot želite. Ko dodate vse želene povezave, izberite svoje možnosti: Če imate okvirček, lahko povezave odprete v drugem oknu. Ali pa lahko glavno okno spremenite v poseben cilj, tako da se URL odpre v novem oknu ali drugje. Dajte svojemu meniju edinstven ID za stran. To je potrebno, da skript deluje pravilno. Prav tako vam omogoča, da imate več menijev za preskakovanje v eni obliki - samo jim dajte vsa imena. Rad bi izbral to, ker včasih skript ne deluje, ko se meni spremeni. Prav tako je dostopnejša. Izberite to, če imate kot prvi element menija vpraąanje, na primer »Izberite eno«. To bo zagotovilo, da ta element ostane privzeto na strani. Tako kot v prvem meniju, Dreamweaver nastavi vaš skokov meni v pogledu oblikovanja s privzeto vidno postavko. Spustni meni lahko nato uredite, kot bi vi kateri koli drugi. Če ga uredite, se prepričajte, da ne želite spreminjati nobenih ID-jev na predmetih, sicer skript morda ne bo deloval. Shranjevanje datoteke in zadetek F12 bo prikazal stran v vašem priljubljenem brskalniku. Tam lahko izberete možnost, kliknite »Pojdi« in meni za skok deluje! Style
Položaj
Ključ za dostop
Indeks zavihkov
Izberite meni
Lastnosti menija
Kakšna je razlika med seznamom in menijem?
Dodaj nove elemente seznama
Dodaj več in preuredi
Navedite vrednosti vseh postavk
Izberite privzeto
Oglejte si svoj seznam v pogledu oblikovanja
Oglejte si svoj seznam v pogledu kode
Shrani in prikaži v brskalniku
Ampak to ne naredi ničesar …
Skoči okno menija
Dodaj elemente v vaš skokov meni
Možnosti skokovnega menija
Odpri URL-ji v
Ime menija
Vstavi gumba Go Po meniju
Izberite prvi element po spremembi URL-ja
Pogled skeniranja menija
Skoči v meni Brskalnik
