IE7 Peekaboo lignende fejl på dropdown menu.
Hej.Jeg skulle lige erstatte en javascript baseret menu, med en css baseret. Men her på 6 time syntes jeg at være ved at give op.
Menuen fungere fint i alle ønskede browsere pånær IE7 (ie6 får lidt htc hjælp)
Okay, fejlen kan fremprovokeres på følgende måde:
(test scenarie)
Gå ind på:
1 : http://feriehus.inet-designer.dk
2 : Før musen over det sidste menu punkt (Huslejer info)
3 : Før musen over "Hvorfor vælge os?"
3 : Der foldes en ny UL ud, før musen ud på den
4 : Før til sidst musen længere ud til venstre til UL forsvinder
5 : Før så musen over Huslejer info linket igen, der vil man i IE7 se at 3 level stadig er foldet ud, men uden links.
http://img102.imageshack.us/my.php?image=errornj5.png
Jeg har debugget den til at ul, li og a, har haslayout til -1, og jeg kan ikke få den til at fatte andet.
Jeg er fuldstændig blank, når jeg sjovt nok startede op med at lave en tom : http://hornstrup.inet-designer.dk/menu/menu
Følgende er et "live" dumb af markup og CSS, hvor samme fejl optræder, mangler dog lidt layout, men fejlen er der:
----------------- DUMB ----------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
/* Design */
#MainMenu
{
width: 100%;
position: relative;
font-size: 11px;
z-index: 100;
background-color: Red;
}
#MainMenu ul li a, .menu ul li a:visited
{
display: block;
text-decoration: none;
color: #000;
height: 20px;
text-align: center;
color: #fff;
line-height: 20px;
font-size: 10px;
font-weight: bold;
overflow: hidden;
padding: 5px 10px 6px;
border-right: 1px solid white;
text-align: left;
}
#MainMenu ul
{
padding: 0;
margin: 0;
list-style: none;
}
#MainMenu ul li
{
float: left;
position: relative;
}
#MainMenu ul ul
{
display: none;
background-color: #d66d52;
width: 201px;
border-top: 2px solid white;
position: absolute;
top: 31px;
margin-left: -1px;
}
#MainMenu ul ul li
{
float: none !important;
clear:both;
background-color: #d66d52;
height: 23px;
padding: 0px;
border-bottom: 1px solid white;
border-right: 1px solid white;
border-left: 1px solid white;
}
#MainMenu ul ul li a
{
border: 0px !important;
padding: 0px;
padding-left: 10px;
height: 23px;
font-weight: normal;
}
#MainMenu ul ul li a:hover
{
background-color: #c62c29;
}
#MainMenu ul ul ul
{
display: none;
border: 0px;
border-top: 1px solid white;
margin-top: -1px;
}
/* Background on folders */
#MainMenu ul ul li.closed a:hover, #MainMenu ul ul li.closed a, #MainMenu ul ul li.open a
{
background-image: url(/site/images/MainMenu.gif);
background-repeat: no-repeat;
background-position: 190px 8px;
overflow: hidden;
}
#MainMenu ul ul li.closed li a, #MainMenu ul ul li.open li a, #MainMenu ul ul li.closed ul a:hover
{
background-image: none;
}
/* "Events" */
#MainMenu:hover ul ul ul
{
display: none;
}
#MainMenu ul li.folder:hover ul ul
{
display: none;
}
#MainMenu ul li.folder:hover ul
{
display: block;
left: 0px;
}
#MainMenu ul li.folder:hover ul li.folder:hover ul
{
display: block;
position: absolute;
left: 200px;
top: 0;
border-left: 1px solid white;
}
#MainMenu ul li.folder:hover ul li.folder:hover ul ul
{
display: none;
}
</style>
</head>
<body>
<div id="MainMenu">
<ul>
<li class="folder currentfolder open">
<a href="#" title="Klik & find">Klik & find</a>
<ul>
<li class="current">
<a href="idd1.asp" title="Velkommen til Feriehus Udlejning I/S">Velkommen til Feriehus Udlejning I/S</a>
</li>
<li>
<a href="idd3.asp" title="Bestil via katalog nummer">Bestil via katalog nummer</a>
</li>
<li>
<a href="idd10.asp" title="Bestilling">Bestilling</a>
</li>
<li>
<a href="idd503.asp" title="Afbestilling">Afbestilling</a>
</li>
<li>
<a href="idd12.asp" title="Lejebetingelser 2008">Lejebetingelser 2008</a>
</li>
<li>
<a href="idd504.asp" title="Sæsonkalender 2008">Sæsonkalender 2008</a>
</li>
<li>
<a href="idd537.asp" title="Sæsonkalender 2009">Sæsonkalender 2009</a>
</li>
<li>
<a href="idd13.asp" title="Vi tilbyder også">Vi tilbyder også</a>
</li>
<li>
<a href="idd14.asp" title="Last minute">Last minute</a>
</li>
<li>
<a href="idd15.asp" title="Aktuelle tilbud">Aktuelle tilbud</a>
</li>
<li>
<a href="idd16.asp" title="2 personers tilbud">2 personers tilbud</a>
</li>
<li>
<a href="idd17.asp" title="Forhåndsreservation 2009">Forhåndsreservation 2009</a>
</li>
<li>
<a href="idd470.asp" title="Feriehus index">Feriehus index</a>
</li>
<li>
<a href="idd471.asp" title="Feriehus galleri">Feriehus galleri</a>
</li>
</ul>
</li>
<li class="folder closed">
<a href="#" title="Information">Information</a>
<ul>
<li class="folder closed">
<a href="#" title="Områder">Områder</a>
<ul>
<li>
<a href="idd489.asp" title="Vester Husby">Vester Husby</a>
</li>
<li>
<a href="idd491.asp" title="Vedersø Klit">Vedersø Klit</a>
</li>
<li>
<a href="idd493.asp" title="Nørhede Vest/Øst">Nørhede Vest/Øst</a>
</li>
<li>
<a href="idd495.asp" title="Nr. Fjand">Nr. Fjand</a>
</li>
<li>
<a href="idd497.asp" title="Fjand, Bjerghuse & Sdr. Fjand">Fjand, Bjerghuse & Sdr. Fjand</a>
</li>
<li>
<a href="idd499.asp" title="Thorsminde">Thorsminde</a>
</li>
</ul>
</li>
<li class="folder closed">
<a href="#" title="Ferie i Danmark">Ferie i Danmark</a>
<ul>
<li>
<a href="idd534.asp" title="Feriehuse og sommerhuse i Danmark">Feriehuse og sommerhuse i Danmark</a>
</li>
<li>
<a href="idd535.asp" title="5 tips til at finde det rigtige feriehus">5 tips til at finde det rigtige feriehus</a>
</li>
</ul>
</li>
<li>
<a href="idd20.asp" title="Ankomst & Afrejse">Ankomst & Afrejse</a>
</li>
<li>
<a href="idd23.asp" title="Hunde og husdyr">Hunde og husdyr</a>
</li>
<li>
<a href="idd22.asp" title="A-Z info">A-Z info</a>
</li>
<li>
<a href="idd339.asp" title="Rejseforsikringer">Rejseforsikringer</a>
</li>
<li>
<a href="idd502.asp" title="Depositum og Rengøring">Depositum og Rengøring</a>
</li>
<li>
<a href="idd19.asp" title="Kørselsvejledning">Kørselsvejledning</a>
</li>
</ul>
</li>
<li class="folder closed">
<a href="#" title="Aktiviteter">Aktiviteter</a>
<ul>
<li>
<a href="idd506.asp" title="Beach Marathon 2008">Beach Marathon 2008</a>
</li>
<li>
<a href="idd480.asp" title="Bowling">Bowling</a>
</li>
<li>
<a href="idd24.asp" title="Børneoplevelser">Børneoplevelser</a>
</li>
<li>
<a href="idd519.asp" title="Cykelture">Cykelture</a>
</li>
<li>
<a href="idd522.asp" title="Fiskeri">Fiskeri</a>
</li>
<li>
<a href="idd26.asp" title="Golf Tourist Open 2008">Golf Tourist Open 2008</a>
</li>
<li>
<a href="idd518.asp" title="Holstebro Badeland">Holstebro Badeland</a>
</li>
<li>
<a href="idd523.asp" title="Hundeskov">Hundeskov</a>
</li>
<li>
<a href="idd516.asp" title="LEGOLAND">LEGOLAND</a>
</li>
<li>
<a href="idd524.asp" title="Natur">Natur</a>
</li>
<li class="folder closed">
<a href="#" title="Restauranter">Restauranter</a>
<ul>
<li>
<a href="idd525.asp" title="Ulfborg">Ulfborg</a>
</li>
<li>
<a href="idd526.asp" title="Holstebro">Holstebro</a>
</li>
<li>
<a href="idd527.asp" title="Ringkøbing">Ringkøbing</a>
</li>
</ul>
</li>
<li>
<a href="idd521.asp" title="Ridning">Ridning</a>
</li>
<li>
<a href="idd520.asp" title="Skovlegepladser">Skovlegepladser</a>
</li>
<li>
<a href="idd29.asp" title="Store Sildedag">Store Sildedag</a>
</li>
<li>
<a href="idd517.asp" title="Træfpunkt 2008">Træfpunkt 2008</a>
</li>
<li>
<a href="idd27.asp" title="Ulfborg Svømmecenter">Ulfborg Svømmecenter</a>
</li>
<li>
<a href="idd32.asp" title="Ulfborg-Vemb Turistforening">Ulfborg-Vemb Turistforening</a>
</li>
</ul>
</li>
<li class="folder closed">
<a href="#" title="Feriehus udlejning I/S">Feriehus udlejning I/S</a>
<ul>
<li>
<a href="idd47.asp" title="Katalogbestilling">Katalogbestilling</a>
</li>
<li>
<a href="idd488.asp" title="Åbningstider 2008">Åbningstider 2008</a>
</li>
<li>
<a href="idd49.asp" title="Hvem er vi?">Hvem er vi?</a>
</li>
<li>
<a href="idd51.asp" title="Service / Medarbejdere">Service / Medarbejdere</a>
</li>
<li>
<a href="idd52.asp" title="Kontakt os">Kontakt os</a>
</li>
<li>
<a href="idd65.asp" title="Links">Links</a>
</li>
</ul>
</li>
<li class="folder closed">
<a href="#" title="Husejer info">Husejer info</a>
<ul>
<li class="folder closed">
<a href="#" title="Hvorfor vælge os?">Hvorfor vælge os?</a>
<ul>
<li>
<a href="idd478.asp" title="Hvorfor vælge os?">Hvorfor vælge os?</a>
</li>
<li>
<a href="idd479.asp" title="Gratis vurdering">Gratis vurdering</a>
</li>
<li>
<a href="idd59.asp" title="Om at leje ud">Om at leje ud</a>
</li>
<li>
<a href="idd60.asp" title="Markedsføring">Markedsføring</a>
</li>
<li>
<a href="idd346.asp" title="Udlejningsbetingelser">Udlejningsbetingelser</a>
</li>
<li>
<a href="idd64.asp" title="Information">Information</a>
</li>
</ul>
</li>
<li>
<a href="idd62.asp" title="Beskatning">Beskatning</a>
</li>
<li>
<a href="idd63.asp" title="Indretning / Inventar">Indretning / Inventar</a>
</li>
<li>
<a href="idd328.asp" title="Husejer log ind">Husejer log ind</a>
</li>
</ul>
</li>
</ul>
</div>
</body>
Håber nogen har oplevet det før, eller har en løsning.
På forhånd tak.
Venligst
Jacob
</html>
