Hej! Om jag använder mig av onmouseout så stängs menyn lite för snabbt, vill att den ska ligga öppen så man kan se vad som finns i undermenyn, medans man kollar en länk under samma kategori. Deklarera en global javascript variabel (inte i en function alltså). Tack...jag ska se om jag kan klura ut det...ska slå ihop mitt huvud med en polare som är lite bättre på Js än vad jag är..=) Jag sökte efter en meny som liknade den du höll på med så jag testade lite och hittade en lösning som funkar bra (hoppas jag?). Du har säkert också hittat en lösning nu men det kan vara bra att skriva ut en fungerande lösning om någon söker efter menyer sen. Jag fick tag i något liknande det du har lagt upp, och jag publicerar det här jag med, som sagt, bra ifall någon behöver en meny...Hjälp med javascript meny
Jag har en meny som bygger på javascript och dhtml.
Koden ser ut som följer:
<code>
<SCRIPT>
function menu(obj) {
if(obj.style.display=='none') {
obj.style.display=''
}
else obj.style.display='none'
}
</SCRIPT></code>
I body ser det ut så här:
<code>
Hem<br>
Företaget<br>
<SPAN OnClick="menu(tjänster)">
Tjänster</SPAN><br>
<SPAN STYLE="display: none" ID="tjänster">
-Webdesign<br>
-Positionering<br>
-Webshop<br>
</SPAN>
<SPAN OnClick="menu(simple)">
SimpleUpdate</SPAN><br>
<SPAN STYLE="display: none" ID="simple">
-Demo<br>
-Köp<br>
</SPAN>
<SPAN OnClick="menu(referenser)">
Referenser</SPAN><br>
<SPAN STYLE="display: none" ID="referenser">
-Webdesign<br>
-Partners<br>
</SPAN>
Kontakt<br>
Support<br>
Jobb
</code>
Menyn i sig fungerar hur fint som helst, men jag skulle vilja att om man har öppnat en undermeny och klickar på en annan länk (som inte tillhör den undermenyn), då ska den öppna menyn stängas.
Tyvärr är jag inte någon höjdare på just detta, så jag ber vänligen om lite hjälp på traven och hoppas att det inte är något stort jobb. Plus att enda boken jag har om javascript är utlånad...=(
Mvh LariSv: Hjälp med javascript meny
Bästa lösningen hade varit att den stängs om man klickar på en annan.
Men jag vet ju inte om det går...Sv: Hjälp med javascript meny
Lägg till onclick på varje huvudrubrik. Där fångar du upp id't på den rubrik du klickade på i en lokal variabel, jämför den med värdet i den globala. Om den globala innehåller ett värde och om det skiljer sig från den lokala så har du klickat på en annan meny en den valda, då kan du stänga den.
Exemplet är inte komplett utan är avsett att visa vägen.
<code>
<script language="javascript">
var oldmenu = "";
function checkmenu(strmenu)
{
if(oldmenu > "")
{
if(oldmenu != strmenu)
{
// annan meny, göm den gamla.
document.getElementById(oldmenu).style.visibility = "hidden";
}
}
oldmenu = strmenu;
}
</script>
<span id="menu1" ......>
<span id="submenu1" ..... onclick="checkmenu('menu1');">
<span id="submenu2" ..... onclick="checkmenu('menu1');">
</code>
/CSv: Hjälp med javascript meny
Sv: Hjälp med javascript meny
Har tagit bort alla länkar från ditt exempel.
<code>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript">
var oldmenu = "";
function menu(strmenu) {
if(strmenu != ""){
if(document.getElementById(strmenu).style.display=='none') {
document.getElementById(strmenu).style.display=''
}
else document.getElementById(strmenu).style.display='none'
}
if(oldmenu > ""){
if(oldmenu != strmenu){
// annan meny, göm den gamla.
document.getElementById(oldmenu).style.display='none';
}
}
oldmenu = strmenu;
}
</SCRIPT>
</head>
<body>
<SPAN OnClick="menu('');">Hem</SPAN><br>
<SPAN OnClick="menu('');">Företaget</SPAN><br>
<SPAN OnClick="menu('tjänster');"> Tjänster</SPAN><br>
<SPAN STYLE="display: none" ID="tjänster">
-Webdesign<br>
-Positionering<br>
-Webshop<br>
</SPAN>
<SPAN OnClick="menu('simple');"> SimpleUpdate</SPAN><br>
<SPAN STYLE="display: none" ID="simple">
-Demo<br>
-Köp<br>
</SPAN>
<SPAN OnClick="menu('referenser');"> Referenser</SPAN><br>
<SPAN STYLE="display: none" ID="referenser" >
-Webdesign<br>
-Partners<br>
</SPAN>
<SPAN OnClick="menu('');">Kontakt</SPAN><br>
<SPAN OnClick="menu('');">Support</SPAN><br>
<SPAN OnClick="menu('');">Jobb </SPAN>
</body>
</html>
</code>Sv: Hjälp med javascript meny
<code>
<script type="text/javascript">
//<![CDATA[<!--
var OpenMenu=""; //id of menu open
function menu(objID) {
obj=document.getElementById(objID);
if(obj.style.display=='block') { //item is open close it
obj.style.display='none';
OpenMenu=""; // no menu open
}
else { //item is closed open it
if(OpenMenu!="") { // if a menu is open close it
document.getElementById(OpenMenu).style.display='none';
}
obj.style.display='block';
OpenMenu=objID; //save menu open
}
}
//-->//]]>
</script>
<style type="text/css">
<!--
#menu {width:120px;}
#menu div {display:none;}
#menu a {display:block;}
--></style>
<div id="menu">
Hem
Företaget
Tjänster
<div id="tjanster">
Webdesign-
Positionering-
Webshop-
</div>
SimpleUpdate
<div id="simple">
Demo-
Köp-
</div>
Referenser
<div id="referenser">
Webdesign-
Partners-
</div>
Kontakt
Support Jobb
</div></code>