Hello all,
We are experiencing issues with getting the visited and hover pseudo classes to work correctly in IE 6 for Wayfinder
First level menu works fine. 2nd level hover works only if there is a 3rd level associated with link, all other second level links do not. 3rd level hovers do not work either. I have tried to set visited with no luck whatsoever. From what I can tell, it should be (for 2nd level):
.menu ul li ul li a:visited
I have tried several different variations with no luck. I have posted the call, dropdown_ie.css, and cssplay-dropdown.config.php. Also, this link contains some information but it does not seem to solve our issue :
http://modxcms.com/forums/index.php?topic=14640.5;wap2.
Call:
[[Wayfinder? &startId=`0` &level=`3` &parentClass=`hide` &parentRowTpl=`cssplay_parentRow` &outerTpl=`cssplay_outer` &innerTpl=`cssplay_inner` &rowTpl=`cssplay_row` &outerClass=`navigation` &cssTpl=`cssplay_dropdown`]]
dropdown_ie.css :
.menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
.menu ul li a:hover ul li a.hide {display:none;}
.menu ul li ul li a.sub {display: none;}
.menu ul li a:hover {color: #00FF99; background: #999 url(../../assets/images/nav-second-hover.jpg) 0 0 repeat-x;}
.menu ul li a:hover ul {display:block; position:absolute; top:21px; left:0; width:135px;}
.menu ul li a:hover ul li a.sub {background: #999 url(nav-second-hover.jpg) 0 0 repeat-x; color: #00FF99;}
.menu ul li a:hover ul li a {display:block; background: #999 url(nav-second-hover.jpg) 0 0 repeat-x; color: #00FF99;}
.menu ul li a:hover ul li a ul {visibility:hidden;}
.menu ul li a:hover ul li a:hover {background: #999 url(nav-second-hover.jpg) 0 0 repeat-x; color:#E96B12;}
.menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:105px; top:0; color: #00FF99;}
.menu ul li a:hover ul li a:hover ul.left {left:-105px;}
body {
behavior: url(../../assets/js/htcmime.php?file=csshover.htc);
}
and cssplay-dropdown.config.php:
<?php
$level = 3;
$parentClass = 'hide';
$outerClass = 'navigation';
$outerTpl = '@CODE:<div id="[+wf.classnames+]">
<ul>
[+wf.wrapper+]
</ul>
</div>';
$rowTpl = '@CODE:<li[+wf.classes+]><a href="[+wf.link+]" title="[+wf.title+]">[+wf.linktext+]</a>[+wf.wrapper+]</li>';
$parentRowTpl = '@CODE:<li><a [+wf.classes+] href="[+wf.link+]" title="[+wf.title+]">[+wf.linktext+]</a>
<!--[if lte IE 6]>
<![endif]-->
[+wf.wrapper+]
<!--[if lte IE 6]>
<![endif]-->
</li>';
$cssTpl = '@CODE:<link rel="stylesheet" media="all" type="text/css" href="assets/snippets/wayfinder/examples/cssplay/dropdown.css" />
<!--[if lte IE 6]>
<link rel="stylesheet" media="all" type="text/css" href="assets/snippets/wayfinder/examples/cssplay/dropdown_ie.css" />
<![endif]-->';
?>
There is modification to the config file, IE6 was giving two links for any link that had a 2nd level, and the 2nd level would not show. Everything as is works in Firefox and IE 7 exactly as planned.
Thanks again for all the help we continue to get from this community.
EDIT FOR SOLVE : had to do with class declarations in dropdown_ie.css, i had changed them in dropdown.css to reflect mods in config.php, but forgot to make the corresponding changes for ie, simple oversight that caused many a headaches...
