Suckerfish met CSS én IE6

[schaap2005]

Ik probeer voor een vriend een website in elkaar te knutselen in Wordpress. Deze is gebasseerd op Wordpress en ik heb een open 'theme' gewijzigd naar mijn smaak. Eén van de zaken die ik veranderd heb is onder andere een suckerfish menu integreren.
Dit menu werkte prima, tot ik erachter kwam dat hij in IE6 niet werkte. Met een simpel javascript leek dit op zijn beurt weer opgelost, maar nu heb ik te maken met ernstige opmaakproblemen van het menu in IE6.

Data
site URL: http://www.dekoffiebeker.nl
stylesheet: http://www.dekoffiebeker.nl/wp-content/themes/big-city/style.css

Om het Suckerfish menu te laten samenwerken met Wordpress heb ik in de header de volgende code toegevoegd:

HTML:

<ul id="suckerfishnav">
            <li class="sf-menu"<?php if ( is_home() ) { ?>current_page_item<?php } ?>"><a href="<?php bloginfo('url'); ?>">Home</a></li>
            <?php wp_list_pages('title_li=&depth=0&sort_column=menu_order'); ?> </ul>

Daarnaast is dit het javascript dat wordt ingeladen bij IE6:

JavaScript:

<!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("suckerfishnav").getElementsByTagName("li");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);//--><!]]> 

Wat is het probleem?
In Google Chrome en de meeste browsers wordt het menu van de site prima weergeven. In IE6, lijkt het op het eerste gezicht ook dat de site prima weergeven wordt: het top-level menu (is dat IL?) ziet er goed uit.
Zodra je echter over item "koffiebekerconcept" gaat, en er een dropdown naar beneden komt, dan is de opmaak van dat menu niet goed.

Het lijkt een beetje alsof IE6 de CSS voor het submenu mist (is dat UL?). Heel vreemd, en ik kom er ook niet goed uit. Dit probleem had ik vanaf het begin af aan ook op de fora van pixopoint gepost, dus daar kan je eventueel ook kijken in mijn post(s). >> http://pixopoint.com/forum/index.php?topic=1297.0

Heeft iemand een idee?

[ Voor 0% gewijzigd door MueR op 14-12-2009 11:01 ]

[OkkE]

IE6 ondersteund geen :hover op een <li> of <ul> element, door de javascript wordt daar voor in de plaats de sfhover class toegevoegd. Deze class moet je in je CSS de zelfde opmaak geven als :hover om het er in IE6 het zelfde uit te laten zien; lijkt er op dat dit nog niet het geval is.