Kaj morate vedeti
- Pojdi na Insert > Form > Form. Kliknite pikčasto rdečo črto na obrazcu in pojdite na Insert > Form > List/Menu. Izberite možnosti dostopnosti.
- Kliknite meni in izberite njegove lastnosti, nato izberite Seznam vrednosti, da dodate nove elemente menija. Kliknite znak plus, da dodate več elementov.
- Dodajte vrednosti elementov in izberite privzeti element. Če želite dodati dejanja, pojdite na Insert > Form > Jump Menu. Dodajte elemente v skočni meni in shranite.
Dreamweaver olajša ustvarjanje spustnih menijev za vaše spletno mesto. Vendar so lahko kot vsi obrazci HTML nekoliko zapleteni. Ta vadnica vas bo vodila skozi korake za ustvarjanje spustnega menija v programu Dreamweaver.
Skočni meniji Dreamweaver
Dreamweaver 8 ponuja tudi čarovnika za ustvarjanje skočnega menija za krmarjenje po vašem spletnem mestu. Za razliko od osnovnih spustnih menijev bo ta meni nekaj naredil, ko boste končali. Za delovanje spustnega obrazca vam ne bo treba pisati nobenega JavaScripta ali CGI-ja. V tej vadnici je razloženo tudi, kako uporabiti čarovnika Dreamweaver 8 za ustvarjanje skočnega menija.
Najprej ustvarite obrazec
Razen posebnih čarovnikov, kot je skočni meni, vam Dreamweaver ne pomaga, da obrazci HTML "delujejo". Za to potrebujete CGI ali JavaScript.
Ko svojemu spletnemu mestu dodajate spustni meni, je prva stvar, ki jo potrebujete, obrazec, ki ga obdaja. V Dreamweaverju pojdite v meni Vstavi in kliknite Obrazec, nato izberite »Obrazec«.
Prikazi obrazcev v pogledu načrta
Dreamweaver vizualno prikaže vašo lokacijo obrazca v pogledu načrtovanja, tako da veste, kam postaviti elemente obrazca, ker oznake spustnega menija niso veljavne (in ne bodo delovale) zunaj elementa obrazca. Kot lahko vidite na sliki, je obrazec rdeča pikčasta črta v pogledu oblikovanja.
Izberi seznam/meni
Spustni meniji se v Dreamweaverju imenujejo elementi "seznama" ali "menija". Če ga torej želite dodati svojemu obrazcu, morate iti v meni Obrazec v meniju Vstavi in izbrati »Seznam/meni«. Prepričajte se, da je vaš kazalec znotraj rdeče pikčaste črte vašega obrazca.
Okno s posebnimi možnostmi
V možnostih Dreamweaverja je zaslon Dostopnost. Vaši spustni meniji bodo takoj lažje dostopni kot druga spletna mesta, če izpolnite teh pet možnosti.
Dostopnost do obrazca
Možnosti dostopnosti so:
Oznaka
Polje oznake se prikaže kot besedilo poleg vašega elementa obrazca. Vnesite ime za spustni meni. To je lahko vprašanje ali kratka fraza, na katero bo odgovoril spustni meni.
Slog
HTML vključuje oznako oznake za prepoznavanje oznak vaših obrazcev v spletnem brskalniku. Vaše izbire so, da spustni meni in besedilo oznake obdate z oznako, uporabite atribut »za« na oznaki oznake, da ugotovite, na katero oznako obrazca se sklicuje, ali da oznake oznake sploh ne uporabite.
Položaj
Svojo oznako lahko postavite pred ali za spustnim menijem.
Ključ za dostop
Obiskovalci lahko uporabijo tipko za dostop s tipko "Slika" ali tipko Možnosti, da pridejo neposredno do tega polja obrazca. S to bližnjico na tipkovnici so vaši obrazci zelo enostavni za uporabo brez miške. alt="
Kazalo zavihkov
Kazalo zavihkov je način, kako naj uporabniki dostopajo do polj obrazca, ko uporabljajo tipkovnico za tabulatorje po spletni strani.
Ko posodobite svoje možnosti dostopnosti, kliknite V redu.
Izberite meni
Ko se prikaže spustni meni v pogledu oblikovanja Dreamweaverja, morate dodati različne elemente. Najprej izberite spustni meni s klikom nanj. Dreamweaver bo okoli spustnega menija postavil še eno pikčasto črto, da pokaže, da ste ga izbrali.
Lastnosti menija
Meni lastnosti se bo spremenil v lastnosti seznama/menija za ta spustni meni. Tam lahko svojemu meniju dodelite ID (kjer piše "izberi"), se odločite, ali želite, da je seznam ali meni, mu dodelite slogovni razred iz vaše slogovne tabele in dodelite vrednosti spustnemu meniju.
Kakšna je razlika med seznamom in menijem?
Dreamweaver pokliče spustni meni katerega koli spustnega menija, ki omogoča samo en izbor. "Seznam" omogoča več izbir v spustnem meniju in je lahko visok več kot en element.
Če želite, da je spustni meni visok več vrstic, ga spremenite v vrsto "seznam" in pustite polje "izbire" nepotrjeno.
Dodaj nove elemente seznama
Če želite v svoj meni dodati nove elemente, kliknite na gumb "Seznam vrednosti…", ki odpre zgornje okno. Nato v prvo polje vnesite oznako artikla. Prikazalo se bo na strani.
Dodaj več in prerazporedi
Kliknite ikono plus, da dodate več elementov. Če jih želite prerazporediti v polju s seznamom, uporabite puščici gor in dol na desni.
Podajte vrednosti vsem elementom
Če pustite vrednost prazno, bo oznaka šla v obrazec. Vsem svojim elementom pa lahko dodelite vrednosti – da na svoj obrazec pošljete nadomestne informacije. To boste veliko uporabljali za stvari, kot so skočni meniji in hiperpovezave.
Izberite privzeto
Spletne strani privzeto prikažejo tisti spustni element, ki je prvi naveden kot privzeti element. Če pa želite izbrati drugo, jo označite v polju »Prvotno izbrano« v meniju Lastnosti.
Oglejte si svoj seznam v pogledu oblikovanja
Ko končate z urejanjem lastnosti, bo Dreamweaver prikazal vaš spustni seznam z izbrano privzeto vrednostjo.
Oglejte si svoj seznam v pogledu kode
Če preklopite na pogled kode, lahko vidite, da Dreamweaver doda vaš spustni meni s čisto kodo. Edini dodatni atributi so možnosti dostopnosti. Koda je vsa zamaknjena in zelo enostavna za branje in razumevanje.
Shrani in si oglej v brskalniku
Če shranite dokument in si ga ogledate v spletnem brskalniku, lahko vidite, da je vaš spustni meni videti tako, kot bi pričakovali.
Ampak ne naredi ničesar…
Meni, ki smo ga ustvarili zgoraj, je videti v redu, vendar ne naredi ničesar. Če želite, da nekaj naredi, morate nastaviti dejanje obrazca na samem obrazcu.
Na srečo ima Dreamweaver vgrajen obrazec s spustnim menijem, ki ga lahko takoj uporabite na svojem spletnem mestu, ne da bi se morali učiti o obrazcih, CGI-jih ali skriptih. Imenuje se skočni meni.
Skočni meni Dreamweaver nastavi spustni meni z imeni in URL-ji. Nato lahko izberete element v meniju in spletna stran se bo premaknila na to mesto, tako kot če bi kliknili povezavo.
Pojdite v meni Vstavi in izberite Obrazec ter nato Skočni meni.
Okno skočnega menija
Za razliko od standardnega spustnega menija meni Skok odpre novo okno, v katerem lahko poimenujete elemente menija in dodate podrobnosti o tem, kako naj obrazec deluje.
Za prvi element spremenite besedilo "un titled1" v tisto, kar želite, da se prebere, in dodajte URL.
Dodajte elemente v svoj skočni meni
Kliknite na dodaj element, da dodate nov element v svoj skokni meni. Dodajte toliko elementov, kot želite.
Možnosti skočnega menija
Ko dodate vse želene povezave, izberite svoje možnosti:
Odpri URL-je v
Če imate nabor okvirjev, lahko odprete povezave v drugem okvirju. Lahko pa spremenite možnost glavnega okna na poseben cilj, tako da se bo URL odprl v novem oknu ali drugje.
Ime menija
Dajte svojemu meniju edinstven ID za stran. Potreben je za pravilno delovanje skripta. Prav tako vam omogoča, da imate več skočnih menijev v eni obliki – dajte jim različna imena.
Vstavi gumb Go za meni
Rad bi izbral to, ker včasih skript ne deluje, ko se spremeni meni. Je tudi bolj dostopen.
Izberi prvi element po spremembi URL-ja
Izberite to, če imate kot prvi element menija poziv, kot je »Izberi enega«. To bo zagotovilo, da ta element ostane privzet na strani.
Pogled oblikovanja skočnega menija
Tako kot pri vašem prvem meniju, Dreamweaver nastavi vaš skočni meni v pogledu načrtovanja z vidnim privzetim elementom. Nato lahko uredite spustni meni kot vse druge.
Če ga urejate, se prepričajte, da ne spremenite nobenega ID-ja elementov; sicer skript morda ne bo deloval.
Skočni meni v brskalniku
Če shranite datoteko in pritisnete F12, se stran prikaže v vašem priljubljenem brskalniku. Tam lahko izberete možnost, kliknete »Pojdi« in skočni meni deluje.