Beste mensen,

Ik heb in jquery in combinatie met html en css een menu gemaakt. Dit menu is gebaseerd op superfish plugin van jquery. Alleen het werkt niet helemaal zo als het zou moeten namelijk:

Als je het menu opent en daarvan een submenu bekijkt ziet dit er goed uit. Maar in werkelijkheid zit het sub-menu achtergrondje schreef waardoor je niet altijd op de juiste pagina komt.

Ik ben tot deze conclusie gekomen door de border aan te zetten zie de onderstaande afbeelding.
MAAR: Het gebeurd niet altijd, soms werkt die wel goed en soms niet.



Het online voorbeeld is hier te vinden: klik hier
Indien je d.m.v een submenu op een pagina komt met als titel: Baangerantie is het de foutieve pagina.

Zou iemand mij kunnen vertellen wat hier fout aan is?

De superfish.css is hier te vinden.
De normale css is hier te vinden.

Alvast hartelijk bedankt!

Ziet er naar uit dat je in de html een </li> ben vergeten in je menu.

Bij
<li id="baangarantie_button">Baan garantie

en

<li>Selectieprocedure

Rob,

Dit lijkt zo inderdaad maar de li wordt wel degelijk afgesloten. Het werkt zo als mijn voorbeeld hier onder, zo als je daar kunt zien is de laatste afsluiten: </li> deze is van de <li>Menu.

Code:

<li>Menu
     <ul>
           <li>Submenu1</li>
           <li>Submenu2</li>
     </ul></li>

Groetjes Mike

Mike,

Inderdaad je heb gelijk , de li wordt wel degelijk afgesloten. Sorry about that!
Maar ik zag dat het wel iets met de <li></li> en <ul></ul> te maken had , dus gezocht in de superfish.css en gevonden.

Vervang in superfish.css ,

.sf-menu ul li ul {
background-color: transparent;
border:1px solid #000000;

}

.sf-menu ul li li{
width: 100%; /*stay*/
background: #FEBF05;
margin-left:0px;
width:160px;
position:relative;
top:-12px;
left:27px;
cursor:pointer;
}

voor

.sf-menu ul li ul {
background-color: transparent;
border:1px solid #000000;
margin-left:30px;
width: 100%; /*stay*/
width:180px;
}
.sf-menu ul li li{
width: 100%; /*stay*/
background: #FEBF05;
position:relative;
width:160px;
cursor:pointer;

}

Ik heb even een heel klein voorbeeld gemaakt (url niet meer van toepassing)
Het menu stelt niets voor maar het gaat om het resultaat en die klopt nu.

ps, Daniel geef ook de oplossing op ep2 als je het er mee eens ben ;)