(html) dropdown menubalk werkt niet in IE8

[spongebob]

ik heb een dropdownmenu in elkaar geknutseld voor onze website en die werkt perfect in Safari. Chrome en FireFox (zowel in Windows als in MacOS).

 

Alleen bij de browser Explorer wil het maar niet werken en wordt het horizontale menu verticaal afgebeeld waardoor de onderliggende knoppen dus helemaal onzichtbaar blijven en dus niet aanklikbaar.

En het probleem is nu net dat de meeste van mijn bezoekers net Explorer in Windows gebruiken. Dit moet ik dus asap opgelost krijgen.

 

Ik heb al een en ander opgezocht, maar ook met een aantal explorer-kunstgrepen die hier nodig zouden zijn, wil het maar niet werken. Ik heb al -tig verschillende manieren geprobeerd, maar ik blijf telkens met hetzelfde resultaat zitten.

 

Heeft iemand een idee wat ik nog kan doen om dit werkend te krijgen?

 

Alvast bedankt!

 

hieronder een fotootje waar het probleem onmiddellijk duidelijk wordt: bovenaan de situatie bij alle browsers, onderaan de situatie bij explorer.

[spongebob]

dit is het script dat ik gebruik om het bij explorer werkend te krijgen:

function startList()

{

if (document.all && document.getElementById)

{

navRoot = document.getElementById("nav");

for (i=0; i<navRoot.childNodes.length; i++)

{

node = navRoot.childNodes;

if (node.nodeName=="LI")

{

node.onmouseover=function()

{

this.className+=" over";

}

node.onmouseout=function()

{

this.className=this.className.replace(" over", "");

}

}

}

}

}

window.onload = startList;

en dit is de CSS-code die ik gebruik:

ul {

padding: 0;

margin: 0;

list-style: none;

}

li {

float: left;

position: relative;

width: 90px;

height: 30px;

}

li ul {

display: none;

position: absolute;

top: 1em;

left: 0;

}

li > ul {

top: auto;

left: auto;

}

li:hover ul, li.over ul{ display: block; }

[Puch]

Ik ben niet zo sterk in css, maar ik denk dat je probleem hem in de float:left zit in je li

 

 

Zet anders dat menu eens in een div en definieer ul en li binnen die div

 

Dit is een voorbeeld die werkt, uiteraard zonder dropdown

 

css

Html:

#menu{	width: 928px;	position: absolute;	margin: -40px 0;}#menu ul{	list-style: none;	text-align: left;	padding: 10px 0px 10px 0px;	margin: 0 0 0 5px;}#menu li{	padding: 0em 0.7em 0em 0.7em;	display: inline;}#menu li a{	color: #000;	font-weight: bold;	text-decoration: none;	border-bottom: 1px solid #FFFFFF;	font-size: 1.2em;}#menu li a.active{	border-bottom: 4px solid #000;}#menu li a:hover{	border-bottom: 4px solid #999999;}

 

Je menu plaats je dan in een div

 

Html:

<div id="menu"><ul>      <li><a href="link">Activeiten</a></li>      <li><a href="link">Therapie</a></li>      <li><a href="link">Vorming</a></li></ul></div>

 

[spongebob]

heel erg bedankt voor je bijdrage, puch. Ik ben al aan het werk geweest met een van je tips en door de <tr> te vervangen door <div> is het al gelukt om de knoppen al op een horizontale lijn te krijgen ipv een verticale bij IE. Dus dat probleem is al van de baan. Optisch ziet het er dus weer allemaal netjes uit.

 

Alleen blijft nu nog het probleem dat (wederom enkel bij IE) er geen menuutjes naar beneden uitrollen als je over de knoppen zweeft (wat wel werkt bij alle andere browsers (en bij de anderen OS'en).

 

Als er iemand (dit toch wel cruciale aspect) dit nog kan oplossen, zou ik hem/haar superdankbaar zijn.

[Puch]

Origineel bericht van: spongebob

if (node.nodeName=="LI")
{

Moet dat niet (node.nodeName=="li") zijn? (kleine letters)

Firefox en zo gaan daar niet over vallen maar IE wel denk ik.

[spongebob]

dag puch,

 

heb jouw tip onmiddellijk geprobeerd, maar jammergenoeg zonder het gewenste resultaat.

 

Nogmaals bedankt voor het meedenken.

 

Spongebob

[Puch]

Ik heb je website eens bezocht en ik denk dat IE problemen heeft met het feit dat het roll over effect om de dropdown menu's de activeren op een afbeelding ligt waar geen link op zit.

 

Zoek daar eens verder op.

 

 

[winwiz]

In IE9beta, met en zonder compabiliteits mode, werkt het ook niet.

[spongebob]

ik weet het ik weet het! het werkt gewoon bij geen enkel IE-versie! en ik weet het echt niet meer...