skriv ut » Dropdown-meny 2
En formulärkontroll SELECT som används tillsammans med ett javascript för att hantera länkar som en meny. Den här meny kan användas med eller utan frames/ramar då alla menyval öppnas i samma mål som kan vara av typen _SELF _TOP _BLANK (läs mer om mål för länk i guiden Frames ramar »)
TIPS! Se ett annat exempel i guiden Drop-downmeny 1 »
Steg 1:
Lägg koden inom <HEAD>
De länkar som inte ska öppnas i samma fönster eller ram som menyn skrivs in javascriptet. I exemplet nedan används olika mål för de övriga länkarna. En länk öppnas i hela fönstret (_TOP), tre länkar öppnas i samma frameset men utanför ramen (_PARENT) och en länk öpnnas i ett nytt fönster (_BLANK).
Namnet på formuläret och namnet på formulärkontrollen SELECT måste anges i javascriptet. I exemplen ovan är formulärnamnet "menyform" och formulärkontrollens namn är "listmeny".
<script language="javascript">
function dropdownmeny() {
link="";
link=document.menyform.listmeny.options[document.menyform.listmeny.selectedIndex].value;
// länk till hela fönstret (_TOP)
if(link=="http:/www.adress1.se") top.location.href=link;
// länk till frameset utanför ramen (_PARENT)
if(link=="http:/www.adress2.se"
||link=="http:/www.adress3.se") parent.location.href=link;
// länk till nytt fönster (_BLANK)
if(link=="http://www.google.se") window.open().location.href=link;
// övriga länkar till angiven målram
else if(link!="#") parent.frames['ramnamn'].location.href=link;
}
</script>
</HEAD>
TIPS! Ange flera länkar till samma mål separerade med två "filtertecken": || så behöver du inte upprepa "if-villkoret" flera gånger.
Steg 2:
Lägg koden inom <BODY>
De länkar som inte är angivna i scriptet ovan öppnas i ramen med det angivna ramnamnet. De länkar som angivits i javascriptet i scriptet öppnas i de mål som specificerats.
<form name="menyform">
<select name="listmeny" onChange="dropdownmeny();">
<option value="#">Välj meny här!</option>
<option value="http:/www.adress1.se">Adress 1</option>
<option value="http:/www.adress2.se">Adress 2</option>
<option value="http:/www.adress3.se">Adress 3</option>
<option value="http:/www.google.se">Google</option>
<option value="../mapp/sida1.html>Min sida 1</option>
<option value="../mapp/sida2.html">Min sida 2</option>
</select>
</form>
</BODY>
Steg 3:
Om du länkar till samma ram eller inte använder frames
Om du använder menyn utan frames/ramar har du inget namn på ramen och ändrar då målet att gälla samma fönster.
Byt ut koden:
// övriga länkar till angiven målram (_framename)
else if(link!="#") parent.frames['ramnamn'].location.href=link;
Ny kod:
// övriga länkar till angiven målram (_framename)
else if(link!="#") window.location.href=link;
Steg 4:
Ändra mål för länkarna(vid behov)
Länkade sidor öppnas i samma fönster eller ram. Om du vill ändra mål för länkarna byter du ut "window" i koden ovan mot något av exemplen nedan:
Öppnas i samma ram eller fönster ( _SELF) :
window.location.href =
URL;
Öppnas i hela fönstret (utanför frameset, _TOP ):
top.location.href = URL;
Öppnas i samma frameset men utanför ramen ( _PARENT ):
parent.location.href = URL;
Öppnas i nytt fönster:
window.open().location.href = URL;
Öppnas i en namngiven ram/frame:
parent.frames['ramnamn'].location.href
= URL;