Hvordan lage drop down menyer i en webside

Hvordan lage drop down menyer i en webside


Drop-down menyer kan være en praktisk måte å gi flere valg for brukerne uten å bruke en masse skjermen eiendomsmegling. Du kan bruke rullegardinmenyer i skjemaer eller som et navigeringsverktøy. Opprette rullegardinmenyer i et nettsted er ganske enkelt med HTML-kode.

Bruksanvisning

1 Skriv syntaks for et skjema. Koden for drop-down menyer er inne i en form. Plasser markøren der du vil ha på rullegardinmenyen for å begynne. Type "<form name =" name "> </ form>" hvor "navn" er navnet på skjemaet.

2 Skriv syntaks til å begynne på rullegardinlisten. Plasser markøren mellom form åpning og lukking koder. Type "<velg name =" drop-down-liste "> </ select>" der "drop-down list" er navnet på listen.

3 Skriv syntaks for drop-down listeelementer. Plasser markøren mellom de enkelte åpning og lukking koder. Skriv inn følgende kode for hvert element i rullegardinmenyen: "<option value =" action "> artikkel </ option>" der "action" er hva som skjer når brukeren velger elementet og "element" er det som vises i rullegardinlisten.

4 Skriv syntaks for knappen. Plasser markøren etter velger avsluttende koden, men før skjemaet avsluttende koden. Skriv inn <input type = "button" onclick = "location = document.jump.menu.options [document.name.menu.selectedIndex] .Value;" value = "-knappen name"> der "-knappen navn" er det som vises på knappen.

5 Se følgende eksempel. Kopier og lim inn følgende kode inn i din webside. Bytt ut skjemaet navn, webadresser, rullegardinlisteelementer og knappenavn med ønsket informasjon.

<Form name = "name">
<Velg name = "meny">
<Option value = "hjem & lt; / option" rel = "nofollow" target = "_blank"> http://lemonheaddesigns.com/home.html&quot;> hjem & lt; / option>
<Option value = "om & lt; / option" rel = "nofollow" target = "_blank"> http://lemonheaddesigns.com/about.htm&quot;> om & lt; / option>
<Option value = "portefølje & lt; / option" rel = "nofollow" target = "_blank"> http://lemonheaddesigns.com/portfolio.htm&quot;> portefølje & lt; / option>
</ Velge>
<Input type = "button" onclick = "location = document.jump.menu.options [document.name.menu.selectedIndex] .Value;" value = "Go">
</ Form>