Intressant, har inte märkt detta problem förut, och jag hoppas någon ger ett bra svar på frågan.
Tänkte föreslå att stoppa in listan i en tabell, men märkte att det var exakt samma problem där, även utan en lista mellan de olika cellerna.
Det närmsta förslaget jag kommer på är att lägga in en Timeout med en hundradels delay och clearas om man kommer in i listan igen under den tiden.
Hursomhelst så var det extremt frustrerande att onmouseout triggades hela tiden hur man än gjorde (Testade med layers, tabeller m.m. Men samma resultat)
När muspekaren lämnar en <li> triggas händelsen onmouseout för det elementet. Denna händelse bubblar sedan uppåt i hierarkin och aktiveras för alla föräldranoder och, framför allt, <ul>-elementet u. Därav din alert().
Koden jag gav kollar föräldranoderna till det element e muspekaren föres till. Om u är släkt med e i rakt uppåtstigande led, d.v.s. att u innehåller e, vet vi att muspekaren fortfarande finns kvar i menyn. När muspekaren lämnar u, kommer inte en annan föräldranod av typen <ul> att hittas, varpå alert():en kommer att ljuda.
Om menyn kommer att innehållas av ett annat <ul>-element, kan du använda följande istället:
<html>
<head>
<script type="text/javascript">
function f(o){
var e = window.event.toElement,
found = false;
while (e.parentNode){
if (e == o){
found = true;
break;
}
e = e.parentNode;
}
if (!found){
alert("Leaving menu!");
}
}
</script>
</head>
<body>
<ul onmouseout="f(this)" style="border:1px solid #999;list-style:none;">
<li style="border:1px solid #F00;">Länk 1</li>
<li style="border:1px solid #00F;">Länk 2</li>
<li style="border:1px solid #F00;">Länk 3</li>
</ul>
</body>
</html>
Menyn är dold från början och visas när man trycker på en knapp. Problemet är att om man aldrig går in över menyn körs ju aldrig onmouseover. Finns det något sätt att stänga menyn när man t.ex. klickar utanför menyn?
<html>
<head>
<script type="text/javascript">
function f(o){
var e = window.event.toElement,
found = false;
while (e && e.parentNode){
if (e == o){
found = true;
break;
}
e = e.parentNode;
}
if (e && !found){
// ...
}
}
function closeMenu(){
var e = window.event.srcElement,
found = false;
while (e && e.parentNode){
var tn = e.tagName.toLowerCase();
if (tn == "li" || tn == "ul"){
found = true;
break;
}
e = e.parentNode;
}
if (e && !found){
document.getElementById("menu").style.display = "none";
}
}
</script>
</head>
<body onmouseup="closeMenu()">
<ul id="menu" onmouseout="f(this)" style="border:1px solid #999;list-style:none; display:none">
<li style="border:1px solid #F00;">Länk 1</li>
<li style="border:1px solid #00F;">Länk 2</li>
<li style="border:1px solid #F00;">Länk 3</li>
</ul>
<form>
<input type="button" value="show menu" onclick="document.getElementById('menu').style.display = 'block'">
</form>
</body>
</html>
Du skulle kunna sätta en variabel till något värde när du öppnar menyn. När man sedan klickar - eller för muspekaren - på ett annat element, kollar du om variabeln är satt och, i sådana fall, stänger menyn. :)
Men det finns inte något mer generellt sätt att se om menyn inte är i focus? Här på wF försvinner ju t.ex. popup-menyer när man klickar utanför dom.
Så fungerar ju exemplet jag postade också. Klickar du någon annanstans än i menyn, stängs den. Eller har möjligtvis missuppfattat dig?
Exakt hur menysystemet är uppbyggt på wF vet jag inte. Men jag kan tänka mig att de initialiserar händelsehanterare för varje menyelement som, när man klickar på ett alternativ, sparar vilken meny som är öppen i en global variabel. Klickar du på en annan meny, hämtas värdet på denna variabel med vilket man kan stänga den förra menyn. Givetvis stängs alla menyer skulle man klicka på en "icke-meny".
Så fungerar ju exemplet jag postade också. Klickar du någon annanstans än i menyn, stängs den. Eller har möjligtvis missuppfattat dig?
Nä, du fattar helt rätt. Jag missade en grej i ditt script som gjorde att det inte funkade.
Nu har jag flera frames så jag skulle vilja ha något bättre än onmouseup i body-taggen. Det kan ju vara så att man klickar i någon annan frame och då ligger menyn kvar. Vad jag förstår kan man inte köra onblur på en body-tagg utan man för lägga det på framen (i frameset) men därifrån kan jag inte få closeMenu() utan att funka...
/r Kom på att det inte var några problem att stänga main-framen vid onblur men problemet är ju att den framen inte får focus när menyn öppnas. Focus ligger ju fortfarande kvar i framen där jag öppnar menyn ifrån... Får klura lite till...
Jag kör med en liknande top-variabel för att hålla reda på om menyn är öppen eller stängd.
Efter att jag har öppnat en meny med onclick vill jag att dom andra ska öppnas vid onmouseover och då funkar top-variabeln bra.
Sedan så vill jag även att menyn ska försvinna om man t.ex. går ifrån fönstret så jag kör med onblur på framen där menyn öppnas och flyttar alltid focus till den framen i samband med att jag öppnar en meny.
Tack för all hjälp! :)
253 ms totalt · 4 externa anrop · v20260731065814-full.1dc6f849
