Tutorial på Pop-up-meny i Javascript
Avhengig av det totale antall koblinger som finnes i ditt nettsted, kan mengden av siden plass en fast meny tar være ganske omfattende. Mange nettsteder inneholder mer enn en enkel tre til fem sider, og dette gjenspeiles i et godt designet menylinjen. For å redusere det totale side plass tatt av en ganske omfattende meny, ved hjelp av Javascript for å lage en pop-up-menyen kan være i orden. Med etableringen av en menyside og litt koding i eksisterende sider, kan du raskt få en pop-up meny som er enkel å bruke og navigere.
Bruksanvisning
1 Skriv ned en liste over alle nettsider som ligger innenfor ditt nettsted. Å ha en liste over nettadresser og sidenavnene vil gjøre resten av denne prosessen mye enklere.
2 Opprett en ny nettside i enten en nettside program eller Notepad og gi den navnet \ "menu.html. \" I kroppen delen av denne nettsiden (mellom <body> og </ body>), lage koblinger til ulike websider ved hjelp av følgende kode linje som et eksempel:
<a href=\"javascript:openPUMenu('home.html')\"> Hjem </a>
Du kan sette inn de aktuelle sidenavn og titler for \ "home.html \" og \ "Home. \" Legg så mange linker som er nødvendig for å sikre alle nettsidene er inkludert.
3 Rediger hodedelen i menu.html (mellom <head> og </ head>) for å inkludere følgende Javascript-kode:
<Script language = \ "Javascript \">
<! -
funksjon openPUMenu (nURL) {
opener.document.location = nURL;
}
// ->
</ Script>
Denne delen av koding vil korrespondere med linker plassert i hoveddelen av den forrige siden.
4 Åpne nettsiden der du ønsker å inkludere Javascript-lokalmenyen i en web-redigering program. Notisblokk vil også fungere fint for dette formålet. Skriv inn følgende kode i overskriften på denne siden:
<Script language = \ "Javascript \">
<! -
funksjon openPUNav () {
win = window.open(\"menu.html\", \"Navigation\",\"width=200,height=300,scrollbars=no,status=no\")
GÅ
}
// ->
</ Script>
Dette Javascript koding forteller ganske enkelt nettleseren til å åpne et nytt nettleservindu som er 200 piksler bred og 300 piksler høye. I tillegg begrenser det visning av nettleservinduet ved å ikke tillate rullefelt eller en statuslinje. Disse alternativene kan redigeres.
5 Finn det området du ønsker å inkludere lokalmenyen link i den åpne siden og skriv inn følgende kode:
<a href=\"javascript:openPUNav()\"> Menynavigering </a>
6 Lagre alle dine opprettet og redigert arbeidet til ditt nettsted. Du kan nå teste ut den nyopprettede Javascript hurtigmenyen ved å gå til nettsiden der du følger menyen link. Istedenfor å lage en ny forekomst av en meny hver gang med nye nettsider, kan du bare legge den nye siden til menu.html siden. I tillegg kan du legge til Javascript openPUNav funksjon og tilhørende meny link til en side der du trenger den nye menyen.