| |
Opret Sidehoved med javascript
|
|
I det foregående eksempel brugte vi én fil til at definere én funktion
, nemlig vores navigationsmenu. I dette eksempel skal vi udbygge navigationsmenuen fra
før, til et egentlig sidehoved
(eller Shared Top Bborder) og samtidigt vise hvordan man definerer flere funktioner eller
menuer i én fil.
|
| Definere variable |
Eksemplet her er lidt mere avanceret. I vores Java Script definerer vi to
variable (var) , nemlig variablen 'topmenu' og variablen 'kontakt'.
Topmenuen er egentlig et sidehoved , hvorfor jeg jo ligesågodt ku' ha kaldt den det!
(meget pædagogisk..hva'!) |
|
Nedenfor ser du script-koderne til mit sidehoved.
Koden starter med at vi laver en variabel som hedder 'topmenu'
Herefter oprettes en tabel , og i tabellens første celle indsættes grafikfilen
'html.gif'. Herefter mine links til navigationsmenuen. Og tilsidst afsluttes tabellen.
Bemærk at alle kodelinjer starter med citationstegn (") og afsluttes med ("+)
Herefter defineres en ny variabel nemlig var=kontakt. Denne variabel vil jeg indsætte
nederst på min side. |
|
var topmenu="<table width=100% background='#cfcfcf'>"+
"<tr><td><img src='html.gif' align=left></td>"+
"<td><br><br><font size='-1'>"+
"<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'>Opgave 2</a> | "+
"<a href='JavaScript:history.back()'>Tilbage</a> "+
"</td></tr></table>"
var kontakt="<hr width=80% size=1 color=white>"+
"<h6>Siden her er lavet i Notesblok <br>"+
" Hilsen Otto Leholt tlf. 3537
4928 eller "+
"<a href='mailto:leholt@worldonline.dk'>e-mail</a></h6>"
|
| Gem din script-fil |
Ovenstående kode skrives i Notesblok. Når du har skrevet koden,
selvfølgelig med anvendelse af dine egne links og mailadresse, skal filen gemmes som f.eks 'script.js'
. Filen gemmes i roden af mit web-site.
|
| Indsæt link til script.js |
Herefter skal du på alle dine web-sider indsætte et
link til din script-fil.
I modsætning til det foregående eksempel skal der nu oprettes to henvisninger.
I HEAD-sektionen indsættes et link til vores 'script-fil' , og i
BODY-sektionen indsætter vi så link til de variable (topmenu eller kontakt) i
script-filen, der hvor vi vil have dem vist på web-siden I
<HEAD>- sektionen indsættes følgende: |
| HEAD sektionen |
<SCRIPT LANGUAGE="JavaScript1.2"
SRC="script.js"></SCRIPT>
|
|
Umiddelbart efter BODY-koden indsætter jeg dette link , som derefter
viser variablen 'topmenu' . |
| BODY sektionen |
<SCRIPT
LANGUAGE="JavaScript1.2">document.write(topmenu)</Script>
|
|
Nederst på siden indsætter jeg link til min variabel 'kontakt' . Linket
ser således ud : |
|
<SCRIPT
LANGUAGE="JavaScript1.2">document.write(kontakt)</Script>
|
| Problemer: |
Hvis det ikke virker - check at alle kodelinjer i filen script.js ,
starter med " og afsluttes med "+ |
| Se eksempel |
Se eksempel her på hvordan det virker
Sidehoved
med navigationsmenu |
