Navigationsmenu

Sidst opdateret
26. februar 2005

 

Navigationsmenu med JavaScript

Med FrontPage

 

Uden FrontPage

Med FrontPage er det nemt at indsætte en navigationsmenu på dine web-sider. Det kan du bla. lære på siden shared borders.

Men da man jo udmærket kan lave web-sider uden FrontPage skal du også vide hvordan du redigerer dit navigationspanel med meget enkle midler.
Hvis du på et større web-site har en navigationsmenu som er ens på alle sider( og det vil ofte være hensigtsmæssigt) kan det være overordentlig besværligt hvis du skal ind og rette koderne på alle sider. I stedet gør man det at man opretter en fil som alene indeholder navigationspanelet, og på de enkelte web-sider henvises så til denne fil.
Fordelen er at du kan redigere dit navigationspanel blot ved at redigere i én fil og ændringer vil blive vist på alle dine web-sider. (altså præcist som du har set med Style Sheets)

Eksempel Lad os sige at du har følgende navigationspanel på alle dine websider:

Forside | Danmarks Radio | Opgave-1 | Opgave-2 | Mail

HTML-koderne hertil vil se sådan ud :

<a href="index.htm">Forsiden</a> |
<a href="http://www.dr.dk">Danmarks Radio</a> |
<a href="opgave1.htm">Opgave 1</a> |
<a href="opgave2.htm.dk">Opgave 2</a> |
<a href="mailto:leholt@worldonline.dk"</a>

Opret en Script-fil Hver gang du tilføjer nye sider til dit web-site , eller hvis du f.eks får ny mailadresse skal du id på alle websiderne og ændre eller tilføje links i dit navigationspanel. Nej - det går ikke .
I stedet opretter vi en fil som indeholder navigationsmenuen .
Ud fra ovenstående eksempel vil denne fil se sådan ud :


document.write("<center><hr><font size='-1'>")
document.write("<a href='index.htm'>Forsiden</a> | ")
document.write("<a href='http://www.dr.dk'>Danmarks Radio</a> | ")
document.write("<a href='opgave1.htm'>Opgave 1</a> | ")
document.write("<a href='opgave2.htm'>Opgave 2</a> | ")
document.write("<a href='mailto:leholt@worldonline.dk'>Mail</a> ")
document.write("<hr></center></font>")
Filen skrives f.eks i notesblok og gemmes som menu.js, i roden af dit web-site, dvs. samme sted som din default / index fil.
Filtype js står for JavaScript. Filen skal ikke indeholde andet tekst end det der er vist her. Altså ikke noget med <HTML> <BODY> etc etc .
Indsæt link til menu.js På dine web-sider indsætter du nu følgende link der hvor menuen skal indsættes :
<script type="text/javascript" src="menu.js"></script>
Se Eksempel Se her hvor det virker i praktis navigationsmenu-1
For et mere avanceret eksempel på navigationsmenu og side hoved se her
Problemer : Hvis det ikke virker kan du være helt sikker på at du har glemt en parantes eller et citationstegn("). Bemærk at der i selve html-koderne anvedes enkeltcitationstegn (').

 

 

© Otto leholt

Til top af siden